<
!
DOCTYPE html >

<
html lang

=
"en"
>

<
head >

<
meta charset

=
"utf-8"
>

<
link rel

=
"dns-prefetch"
href

=
"https://github.githubassets.com"
>

<
link rel

=
"dns-prefetch"
href

=
"https://avatars0.githubusercontent.com"
>

<
link rel

=
"dns-prefetch"
href

=
"https://avatars1.githubusercontent.com"
>

<
link rel

=
"dns-prefetch"
href

=
"https://avatars2.githubusercontent.com"
>

<
link rel

=
"dns-prefetch"
href

=
"https://avatars3.githubusercontent.com"
>

<
link rel

=
"dns-prefetch"
href

=
"https://github-cloud.s3.amazonaws.com"
>

<
link rel

=
"dns-prefetch"
href

=
"https://user-images.githubusercontent.com/"
>


<
link crossorigin

=
"anonymous"
media

=
"all"
integrity

=
"sha512-2Ty0cnzTf9xIUhLCesHogbONz2ORqXtSfKSGGlp7lO1BcOdnfWxmN9wb6iUZ3SrnbetN/1LqH7um4h6EEyiFzg=="
rel

=
"stylesheet"
href

=
"https://github.githubassets.com/assets/frameworks-6d77727425da1674522be0af5d10b6b3.css"
/
>

<
link crossorigin

=
"anonymous"
media

=
"all"
integrity

=
"sha512-Y6G3aOlf/U2NR/wIIjpohcCyXJAhnFlHYRK7MWCf8kPfOs/ZwHm8BpsG6qxWLMhtVg70t9PqeHnX5hL538X2Bg=="
rel

=
"stylesheet"
href

=
"https://github.githubassets.com/assets/github-f54613a1d135ca4f8c267a21bc600847.css"
/
>


<
meta name

=
"viewport"
content

=
"width=device-width"
>

<
title > CodeTest

/
player.css at master · dunizb

/
CodeTest

<
/
title >

<
meta name

=
"description"
content

=
":pig:个人代码库，日常JS代码都在这里，防止电脑数据丢失。。。0.0。更新内容请关注README.md - dunizb/CodeTest"
>

<
link rel

=
"search"
type

=
"application/opensearchdescription+xml"
href

=
"/opensearch.xml"
title

=
"GitHub"
>

<
link rel

=
"fluid-icon"
href

=
"https://github.com/fluidicon.png"
title

=
"GitHub"
>

<
meta property

=
"fb:app_id"
content

=
"1401488693436528"
>


<
meta property

=
"og:image"
content

=
"https://avatars0.githubusercontent.com/u/9447187?s=400&amp;v=4"
/
>

<
meta property

=
"og:site_name"
content

=
"GitHub"
/
>

<
meta property

=
"og:type"
content

=
"object"
/
>

<
meta property

=
"og:title"
content

=
"dunizb/CodeTest"
/
>

<
meta property

=
"og:url"
content

=
"https://github.com/dunizb/CodeTest"
/
>

<
meta property

=
"og:description"
content

=
":pig:个人代码库，日常JS代码都在这里，防止电脑数据丢失。。。0.0。更新内容请关注README.md - dunizb/CodeTest"
/
>

<
link rel

=
"assets"
href

=
"https://github.githubassets.com/"
>

<
link rel

=
"web-socket"
href

=
"wss://live.github.com/_sockets/VjI6MzkxNzgzNzIzOjk4N2UwOTZkYjBlMGJlOWY4NDFiMDVhMDYwNzVmMDE2YTFiZGZmYWVjZGU3MjE2YzZiMzI3Y2Q5OGY1NDJlYzk=--8bdcc9a1a2ef2d9805d38854a7d3a811c777fae1"
>

<
meta name

=
"pjax-timeout"
content

=
"1000"
>

<
link rel

=
"sudo-modal"
href

=
"/sessions/sudo_modal"
>

<
meta name

=
"request-id"
content

=
"BFC7:36FC:1DF679:3C017A:5CAC6DA0"
data-pjax-transient >


<
meta name

=
"selected-link"
value

=
"repo_source"
data-pjax-transient >

<
meta name

=
"google-site-verification"
content

=
"KT5gs8h0wvaagLKAVWq8bbeNwnZZK1r1XQysX3xurLU"
>

<
meta name

=
"google-site-verification"
content

=
"ZzhVyEFwb7w3e0-uOTltm8Jsck2F5StVihD0exw2fsA"
>

<
meta name

=
"google-site-verification"
content

=
"GXs5KoUUkNCoaAZn7wPN-t01Pywp9M3sEjnt_3_ZWPc"
>

<
meta name

=
"octolytics-host"
content

=
"collector.githubapp.com"
/
>

<
meta name

=
"octolytics-app-id"
content

=
"github"
/
>

<
meta name

=
"octolytics-event-url"
content

=
"https://collector.githubapp.com/github-external/browser_event"
/
>

<
meta name

=
"octolytics-dimension-request_id"
content

=
"BFC7:36FC:1DF679:3C017A:5CAC6DA0"
/
>

<
meta name

=
"octolytics-dimension-region_edge"
content

=
"iad"
/
>

<
meta name

=
"octolytics-dimension-region_render"
content

=
"iad"
/
>

<
meta name

=
"octolytics-actor-id"
content

=
"26736994"
/
>

<
meta name

=
"octolytics-actor-login"
content

=
"lyz921225"
/
>

<
meta name

=
"octolytics-actor-hash"
content

=
"d7f94f8323b4059cf4edc26339f491c6c920f6061e27ec86d3c3d2b12d108610"
/
>

<
meta name

=
"analytics-location"
content

=
"/&lt;user-name&gt;/&lt;repo-name&gt;/blob/show"
data-pjax-transient

=
"true"
/
>


<
meta name

=
"google-analytics"
content

=
"UA-3769691-2"
>

<
meta class

=
"js-ga-set"
name

=
"userId"
content

=
"db6eb631722d4ef57dafddcdbcbcff81"
>

<
meta class

=
"js-ga-set"
name

=
"dimension1"
content

=
"Logged In"
>


<
meta name

=
"hostname"
content

=
"github.com"
>

<
meta name

=
"user-login"
content

=
"lyz921225"
>

<
meta name

=
"expected-hostname"
content

=
"github.com"
>

<
meta name

=
"js-proxy-site-detection-payload"
content

=
"NDdmOTVlNjE2ZjFjMzMxZTNlYTI5ZWVjYzk2Mjc5OTdlOTc3MjI2YTRjOTQ4YjE2NDM3MWFlYmZiOGQ5Yjc1NXx7InJlbW90ZV9hZGRyZXNzIjoiNDIuMy4xMDQuMTMzIiwicmVxdWVzdF9pZCI6IkJGQzc6MzZGQzoxREY2Nzk6M0MwMTdBOjVDQUM2REEwIiwidGltZXN0YW1wIjoxNTU0ODA0MTM0LCJob3N0IjoiZ2l0aHViLmNvbSJ9"
>

<
meta name

=
"enabled-features"
content

=
"UNIVERSE_BANNER,MARKETPLACE_INVOICED_BILLING,MARKETPLACE_ENTERPRISE_CONTACTS,MARKETPLACE_SOCIAL_PROOF_CUSTOMERS,MARKETPLACE_TRENDING_SOCIAL_PROOF,MARKETPLACE_RECOMMENDATIONS,NOTIFY_ON_BLOCK,RELATED_ISSUES"
>

<
meta name

=
"html-safe-nonce"
content

=
"81f151ebd0adf6081f710f6d45409788f53938e6"
>

<
meta http-equiv

=
"x-pjax-version"
content

=
"ca4af2bc2ee7015fd201a2517e1d47ce"
>


<
link href

=
"https://github.com/dunizb/CodeTest/commits/master.atom"
rel

=
"alternate"
title

=
"Recent Commits to CodeTest:master"
type

=
"application/atom+xml"
>

<
meta name

=
"go-import"
content

=
"github.com/dunizb/CodeTest git https://github.com/dunizb/CodeTest.git"
>

<
meta name

=
"octolytics-dimension-user_id"
content

=
"9447187"
/
>

<
meta name

=
"octolytics-dimension-user_login"
content

=
"dunizb"
/
>

<
meta name

=
"octolytics-dimension-repository_id"
content

=
"63790490"
/
>

<
meta name

=
"octolytics-dimension-repository_nwo"
content

=
"dunizb/CodeTest"
/
>

<
meta name

=
"octolytics-dimension-repository_public"
content

=
"true"
/
>

<
meta name

=
"octolytics-dimension-repository_is_fork"
content

=
"false"
/
>

<
meta name

=
"octolytics-dimension-repository_network_root_id"
content

=
"63790490"
/
>

<
meta name

=
"octolytics-dimension-repository_network_root_nwo"
content

=
"dunizb/CodeTest"
/
>

<
meta name

=
"octolytics-dimension-repository_explore_github_marketplace_ci_cta_shown"
content

=
"false"
/
>


<
link rel

=
"canonical"
href

=
"https://github.com/dunizb/CodeTest/blob/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css"
data-pjax-transient >


<
meta name

=
"browser-stats-url"
content

=
"https://api.github.com/_private/browser/stats"
>

<
meta name

=
"browser-errors-url"
content

=
"https://api.github.com/_private/browser/errors"
>

<
link rel

=
"mask-icon"
href

=
"https://github.githubassets.com/pinned-octocat.svg"
color

=
"#000000"
>

<
link rel

=
"icon"
type

=
"image/x-icon"
class

=
"js-site-favicon"
href

=
"https://github.githubassets.com/favicon.ico"
>

<
meta name

=
"theme-color"
content

=
"#1e2327"
>


<
meta name

=
"u2f-enabled"
content

=
"true"
>


<
link rel

=
"manifest"
href

=
"/manifest.json"
crossOrigin

=
"use-credentials"
>

<
/
head >

<
body class

=
"logged-in env-production page-blob"
>


<
div class

=
"position-relative js-header-wrapper "
>

<
a href

=
"#start-of-content"
tabindex

=
"1"
class

=
"p-3 bg-blue text-white show-on-focus js-skip-to-content"
> Skip to content

<
/
a >

<
div id

=
"js-pjax-loader-bar"
class

=
"pjax-loader-bar"
>

<
div class

=
"progress"
>

<
/
div >

<
/
div >


<
header class

=
"Header"
role

=
"banner"
>

<
div class

=
"Header-item"
>

<
a class

=
"Header-link"
href

=
"https://github.com/"
data-hotkey

=
"g d"
aria-label

=
"Homepage"
data-ga-click

=
"Header, go to dashboard, icon:logo"
>

<
svg class

=
"octicon octicon-mark-github v-align-middle"
height

=
"32"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"32"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"
/
>

<
/
svg >

<
/
a >

<
/
div >


<
div class

=
"Header-item Header-item--full"
>

<
div class

=
"header-search mr-3 scoped-search site-scoped-search js-site-search position-relative js-jump-to"
role

=
"combobox"
aria-owns

=
"jump-to-results"
aria-label

=
"Search or jump to"
aria-haspopup

=
"listbox"
aria-expanded

=
"false"
>

<
div class

=
"position-relative"
>

<!--
'"` --><!-- </textarea></xmp> --></option></form><form class="js-site-search-form" role="search" aria-label="Site" data-scope-type="Repository" data-scope-id="63790490" data-scoped-search-url="/dunizb/CodeTest/search" data-unscoped-search-url="/search" action="/dunizb/CodeTest/search" accept-charset="UTF-8" method="get"><input name="utf8" type="hidden" value="&#x2713;" />
<
label class

=
"form-control input-sm header-search-wrapper p-0 header-search-wrapper-jump-to position-relative d-flex flex-justify-between flex-items-center js-chromeless-input-container"
>

<
input type

=
"text"
class

=
"form-control input-sm header-search-input jump-to-field js-jump-to-field js-site-search-focus js-site-search-field is-clearable"
data-hotkey

=
"s,/"
name

=
"q"
value

=
""
placeholder

=
"Search or jump to…"
data-unscoped-placeholder

=
"Search or jump to…"
data-scoped-placeholder

=
"Search or jump to…"
autocapitalize

=
"off"
aria-autocomplete

=
"list"
aria-controls

=
"jump-to-results"
aria-label

=
"Search or jump to…"
data-jump-to-suggestions-path

=
"/_graphql/GetSuggestedNavigationDestinations#csrf-token=f1zzHFwsClAFiqPNKnWTKoMxkM04qBZeWPsCMD1jvcD5dBu2dKBOlf+QkrV54K1MaKcbAltzrIs38cinx3MT5g=="
spellcheck

=
"false"
autocomplete

=
"off"
>

<
input type

=
"hidden"
class

=
"js-site-search-type-field"
name

=
"type"
>

<
img src

=
"https://github.githubassets.com/images/search-key-slash.svg"
alt

=
""
class

=
"mr-2 header-search-key-slash"
>

<
div class

=
"Box position-absolute overflow-hidden d-none jump-to-suggestions js-jump-to-suggestions-container"
>

<
ul class

=
"d-none js-jump-to-suggestions-template-container"
>


<
li class

=
"d-flex flex-justify-start flex-items-center p-0 f5 navigation-item js-navigation-item js-jump-to-suggestion"
role

=
"option"
>

<
a tabindex

=
"-1"
class

=
"no-underline d-flex flex-auto flex-items-center jump-to-suggestions-path js-jump-to-suggestion-path js-navigation-open p-2"
href

=
""
>

<
div class

=
"jump-to-octicon js-jump-to-octicon flex-shrink-0 mr-2 text-center d-none"
>

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-repo flex-shrink-0 js-jump-to-octicon-repo d-none"
title

=
"Repository"
aria-label

=
"Repository"
viewBox

=
"0 0 12 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M4 9H3V8h1v1zm0-3H3v1h1V6zm0-2H3v1h1V4zm0-2H3v1h1V2zm8-1v12c0 .55-.45 1-1 1H6v2l-1.5-1.5L3 16v-2H1c-.55 0-1-.45-1-1V1c0-.55.45-1 1-1h10c.55 0 1 .45 1 1zm-1 10H1v2h2v-1h3v1h5v-2zm0-10H2v9h9V1z"
/
>

<
/
svg >

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-project flex-shrink-0 js-jump-to-octicon-project d-none"
title

=
"Project"
aria-label

=
"Project"
viewBox

=
"0 0 15 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M10 12h3V2h-3v10zm-4-2h3V2H6v8zm-4 4h3V2H2v12zm-1 1h13V1H1v14zM14 0H1a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h13a1 1 0 0 0 1-1V1a1 1 0 0 0-1-1z"
/
>

<
/
svg >

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-search flex-shrink-0 js-jump-to-octicon-search d-none"
title

=
"Search"
aria-label

=
"Search"
viewBox

=
"0 0 16 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M15.7 13.3l-3.81-3.83A5.93 5.93 0 0 0 13 6c0-3.31-2.69-6-6-6S1 2.69 1 6s2.69 6 6 6c1.3 0 2.48-.41 3.47-1.11l3.83 3.81c.19.2.45.3.7.3.25 0 .52-.09.7-.3a.996.996 0 0 0 0-1.41v.01zM7 10.7c-2.59 0-4.7-2.11-4.7-4.7 0-2.59 2.11-4.7 4.7-4.7 2.59 0 4.7 2.11 4.7 4.7 0 2.59-2.11 4.7-4.7 4.7z"
/
>

<
/
svg >

<
/
div >

<
img class

=
"avatar mr-2 flex-shrink-0 js-jump-to-suggestion-avatar d-none"
alt

=
""
aria-label

=
"Team"
src

=
""
width

=
"28"
height

=
"28"
>

<
div class

=
"jump-to-suggestion-name js-jump-to-suggestion-name flex-auto overflow-hidden text-left no-wrap css-truncate css-truncate-target"
>

<
/
div >

<
div class

=
"border rounded-1 flex-shrink-0 bg-gray px-1 text-gray-light ml-1 f6 d-none js-jump-to-badge-search"
>

<
span class

=
"js-jump-to-badge-search-text-default d-none"
aria-label

=
"in this repository"
>
In this repository

<
/
span >

<
span class

=
"js-jump-to-badge-search-text-global d-none"
aria-label

=
"in all of GitHub"
>
All GitHub

<
/
span >

<
span aria-hidden

=
"true"
class

=
"d-inline-block ml-1 v-align-middle"
> ↵

<
/
span >

<
/
div >

<
div aria-hidden

=
"true"
class

=
"border rounded-1 flex-shrink-0 bg-gray px-1 text-gray-light ml-1 f6 d-none d-on-nav-focus js-jump-to-badge-jump"
>
Jump to

<
span class

=
"d-inline-block ml-1 v-align-middle"
> ↵

<
/
span >

<
/
div >

<
/
a >

<
/
li >

<
/
ul >

<
ul class

=
"d-none js-jump-to-no-results-template-container"
>

<
li class

=
"d-flex flex-justify-center flex-items-center f5 d-none js-jump-to-suggestion p-2"
>

<
span class

=
"text-gray"
> No suggested jump to results

<
/
span >

<
/
li >

<
/
ul >

<
ul id

=
"jump-to-results"
role

=
"listbox"
class

=
"p-0 m-0 js-navigation-container jump-to-suggestions-results-container js-jump-to-suggestions-results-container"
>


<
li class

=
"d-flex flex-justify-start flex-items-center p-0 f5 navigation-item js-navigation-item js-jump-to-scoped-search d-none"
role

=
"option"
>

<
a tabindex

=
"-1"
class

=
"no-underline d-flex flex-auto flex-items-center jump-to-suggestions-path js-jump-to-suggestion-path js-navigation-open p-2"
href

=
""
>

<
div class

=
"jump-to-octicon js-jump-to-octicon flex-shrink-0 mr-2 text-center d-none"
>

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-repo flex-shrink-0 js-jump-to-octicon-repo d-none"
title

=
"Repository"
aria-label

=
"Repository"
viewBox

=
"0 0 12 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M4 9H3V8h1v1zm0-3H3v1h1V6zm0-2H3v1h1V4zm0-2H3v1h1V2zm8-1v12c0 .55-.45 1-1 1H6v2l-1.5-1.5L3 16v-2H1c-.55 0-1-.45-1-1V1c0-.55.45-1 1-1h10c.55 0 1 .45 1 1zm-1 10H1v2h2v-1h3v1h5v-2zm0-10H2v9h9V1z"
/
>

<
/
svg >

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-project flex-shrink-0 js-jump-to-octicon-project d-none"
title

=
"Project"
aria-label

=
"Project"
viewBox

=
"0 0 15 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M10 12h3V2h-3v10zm-4-2h3V2H6v8zm-4 4h3V2H2v12zm-1 1h13V1H1v14zM14 0H1a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h13a1 1 0 0 0 1-1V1a1 1 0 0 0-1-1z"
/
>

<
/
svg >

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-search flex-shrink-0 js-jump-to-octicon-search d-none"
title

=
"Search"
aria-label

=
"Search"
viewBox

=
"0 0 16 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M15.7 13.3l-3.81-3.83A5.93 5.93 0 0 0 13 6c0-3.31-2.69-6-6-6S1 2.69 1 6s2.69 6 6 6c1.3 0 2.48-.41 3.47-1.11l3.83 3.81c.19.2.45.3.7.3.25 0 .52-.09.7-.3a.996.996 0 0 0 0-1.41v.01zM7 10.7c-2.59 0-4.7-2.11-4.7-4.7 0-2.59 2.11-4.7 4.7-4.7 2.59 0 4.7 2.11 4.7 4.7 0 2.59-2.11 4.7-4.7 4.7z"
/
>

<
/
svg >

<
/
div >

<
img class

=
"avatar mr-2 flex-shrink-0 js-jump-to-suggestion-avatar d-none"
alt

=
""
aria-label

=
"Team"
src

=
""
width

=
"28"
height

=
"28"
>

<
div class

=
"jump-to-suggestion-name js-jump-to-suggestion-name flex-auto overflow-hidden text-left no-wrap css-truncate css-truncate-target"
>

<
/
div >

<
div class

=
"border rounded-1 flex-shrink-0 bg-gray px-1 text-gray-light ml-1 f6 d-none js-jump-to-badge-search"
>

<
span class

=
"js-jump-to-badge-search-text-default d-none"
aria-label

=
"in this repository"
>
In this repository

<
/
span >

<
span class

=
"js-jump-to-badge-search-text-global d-none"
aria-label

=
"in all of GitHub"
>
All GitHub

<
/
span >

<
span aria-hidden

=
"true"
class

=
"d-inline-block ml-1 v-align-middle"
> ↵

<
/
span >

<
/
div >

<
div aria-hidden

=
"true"
class

=
"border rounded-1 flex-shrink-0 bg-gray px-1 text-gray-light ml-1 f6 d-none d-on-nav-focus js-jump-to-badge-jump"
>
Jump to

<
span class

=
"d-inline-block ml-1 v-align-middle"
> ↵

<
/
span >

<
/
div >

<
/
a >

<
/
li >


<
li class

=
"d-flex flex-justify-start flex-items-center p-0 f5 navigation-item js-navigation-item js-jump-to-global-search d-none"
role

=
"option"
>

<
a tabindex

=
"-1"
class

=
"no-underline d-flex flex-auto flex-items-center jump-to-suggestions-path js-jump-to-suggestion-path js-navigation-open p-2"
href

=
""
>

<
div class

=
"jump-to-octicon js-jump-to-octicon flex-shrink-0 mr-2 text-center d-none"
>

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-repo flex-shrink-0 js-jump-to-octicon-repo d-none"
title

=
"Repository"
aria-label

=
"Repository"
viewBox

=
"0 0 12 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M4 9H3V8h1v1zm0-3H3v1h1V6zm0-2H3v1h1V4zm0-2H3v1h1V2zm8-1v12c0 .55-.45 1-1 1H6v2l-1.5-1.5L3 16v-2H1c-.55 0-1-.45-1-1V1c0-.55.45-1 1-1h10c.55 0 1 .45 1 1zm-1 10H1v2h2v-1h3v1h5v-2zm0-10H2v9h9V1z"
/
>

<
/
svg >

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-project flex-shrink-0 js-jump-to-octicon-project d-none"
title

=
"Project"
aria-label

=
"Project"
viewBox

=
"0 0 15 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M10 12h3V2h-3v10zm-4-2h3V2H6v8zm-4 4h3V2H2v12zm-1 1h13V1H1v14zM14 0H1a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h13a1 1 0 0 0 1-1V1a1 1 0 0 0-1-1z"
/
>

<
/
svg >

<
svg height

=
"16"
width

=
"16"
class

=
"octicon octicon-search flex-shrink-0 js-jump-to-octicon-search d-none"
title

=
"Search"
aria-label

=
"Search"
viewBox

=
"0 0 16 16"
version

=
"1.1"
role

=
"img"
>

<
path fill-rule

=
"evenodd"
d

=
"M15.7 13.3l-3.81-3.83A5.93 5.93 0 0 0 13 6c0-3.31-2.69-6-6-6S1 2.69 1 6s2.69 6 6 6c1.3 0 2.48-.41 3.47-1.11l3.83 3.81c.19.2.45.3.7.3.25 0 .52-.09.7-.3a.996.996 0 0 0 0-1.41v.01zM7 10.7c-2.59 0-4.7-2.11-4.7-4.7 0-2.59 2.11-4.7 4.7-4.7 2.59 0 4.7 2.11 4.7 4.7 0 2.59-2.11 4.7-4.7 4.7z"
/
>

<
/
svg >

<
/
div >

<
img class

=
"avatar mr-2 flex-shrink-0 js-jump-to-suggestion-avatar d-none"
alt

=
""
aria-label

=
"Team"
src

=
""
width

=
"28"
height

=
"28"
>

<
div class

=
"jump-to-suggestion-name js-jump-to-suggestion-name flex-auto overflow-hidden text-left no-wrap css-truncate css-truncate-target"
>

<
/
div >

<
div class

=
"border rounded-1 flex-shrink-0 bg-gray px-1 text-gray-light ml-1 f6 d-none js-jump-to-badge-search"
>

<
span class

=
"js-jump-to-badge-search-text-default d-none"
aria-label

=
"in this repository"
>
In this repository

<
/
span >

<
span class

=
"js-jump-to-badge-search-text-global d-none"
aria-label

=
"in all of GitHub"
>
All GitHub

<
/
span >

<
span aria-hidden

=
"true"
class

=
"d-inline-block ml-1 v-align-middle"
> ↵

<
/
span >

<
/
div >

<
div aria-hidden

=
"true"
class

=
"border rounded-1 flex-shrink-0 bg-gray px-1 text-gray-light ml-1 f6 d-none d-on-nav-focus js-jump-to-badge-jump"
>
Jump to

<
span class

=
"d-inline-block ml-1 v-align-middle"
> ↵

<
/
span >

<
/
div >

<
/
a >

<
/
li >


<
li class

=
"d-flex flex-justify-center flex-items-center p-0 f5 js-jump-to-suggestion"
>

<
img src

=
"https://github.githubassets.com/images/spinners/octocat-spinner-128.gif"
alt

=
"Octocat Spinner Icon"
class

=
"m-2"
width

=
"28"
>

<
/
li >

<
/
ul >

<
/
div >

<
/
label >

<
/
form >

<
/
div >

<
/
div >


<
nav class

=
"d-flex"
aria-label

=
"Global"
>

<
a class

=
"js-selected-navigation-item Header-link  mr-3"
data-hotkey

=
"g p"
data-ga-click

=
"Header, click, Nav menu - item:pulls context:user"
aria-label

=
"Pull requests you created"
data-selected-links

=
"/pulls /pulls/assigned /pulls/mentioned /pulls"
href

=
"/pulls"
>
Pull requests

<
/
a >

<
a class

=
"js-selected-navigation-item Header-link  mr-3"
data-hotkey

=
"g i"
data-ga-click

=
"Header, click, Nav menu - item:issues context:user"
aria-label

=
"Issues you created"
data-selected-links

=
"/issues /issues/assigned /issues/mentioned /issues"
href

=
"/issues"
>
Issues

<
/
a >

<
a class

=
"js-selected-navigation-item Header-link  mr-3"
data-ga-click

=
"Header, click, Nav menu - item:marketplace context:user"
data-octo-click

=
"marketplace_click"
data-octo-dimensions

=
"location:nav_bar"
data-selected-links

=
" /marketplace"
href

=
"/marketplace"
>
Marketplace

<
/
a >

<
a class

=
"js-selected-navigation-item Header-link  mr-3"
data-ga-click

=
"Header, click, Nav menu - item:explore"
data-selected-links

=
"/explore /trending /trending/developers /integrations /integrations/feature/code /integrations/feature/collaborate /integrations/feature/ship showcases showcases_search showcases_landing /explore"
href

=
"/explore"
>
Explore

<
/
a >

<
/
nav >

<
/
div >


<
div class

=
"Header-item"
>

<
a aria-label

=
"You have no unread notifications"
class

=
"Header-link notification-indicator tooltipped tooltipped-s  js-socket-channel js-notification-indicator"
data-hotkey

=
"g n"
data-ga-click

=
"Header, go to notifications, icon:read"
data-channel

=
"notification-changed:26736994"
href

=
"/notifications"
>

<
span class

=
"mail-status "
>

<
/
span >

<
svg class

=
"octicon octicon-bell"
viewBox

=
"0 0 14 16"
version

=
"1.1"
width

=
"14"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M14 12v1H0v-1l.73-.58c.77-.77.81-2.55 1.19-4.42C2.69 3.23 6 2 6 2c0-.55.45-1 1-1s1 .45 1 1c0 0 3.39 1.23 4.16 5 .38 1.88.42 3.66 1.19 4.42l.66.58H14zm-7 4c1.11 0 2-.89 2-2H5c0 1.11.89 2 2 2z"
/
>

<
/
svg >

<
/
a >

<
/
div >


<
div class

=
"Header-item position-relative"
>

<
details class

=
"details-overlay details-reset"
>

<
summary class

=
"Header-link"
aria-label

=
"Create new…"
data-ga-click

=
"Header, create new, icon:add"
>

<
svg class

=
"octicon octicon-plus"
viewBox

=
"0 0 12 16"
version

=
"1.1"
width

=
"12"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M12 9H7v5H5V9H0V7h5V2h2v5h5v2z"
/
>

<
/
svg >

<
span class

=
"dropdown-caret"
>

<
/
span >

<
/
summary >

<
details-menu class

=
"dropdown-menu dropdown-menu-sw"
>

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/new"
data-ga-click

=
"Header, create new repository"
>
New repository

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/new/import"
data-ga-click

=
"Header, import a repository"
>
Import repository

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"https://gist.github.com/"
data-ga-click

=
"Header, create new gist"
>
New gist

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/organizations/new"
data-ga-click

=
"Header, create new organization"
>
New organization

<
/
a >


<
div class

=
"dropdown-divider"
>

<
/
div >

<
div class

=
"dropdown-header"
>

<
span title

=
"dunizb/CodeTest"
> This repository

<
/
span >

<
/
div >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/dunizb/CodeTest/issues/new"
data-ga-click

=
"Header, create new issue"
data-skip-pjax >
New issue

<
/
a >


<
/
details-menu >

<
/
details >

<
/
div >

<
div class

=
"Header-item position-relative mr-0"
>

<
details class

=
"details-overlay details-reset"
>

<
summary class

=
"Header-link"
aria-label

=
"View profile and more"
data-ga-click

=
"Header, show menu, icon:avatar"
>

<
img alt

=
"@lyz921225"
class

=
"avatar"
src

=
"https://avatars0.githubusercontent.com/u/26736994?s=40&amp;v=4"
height

=
"20"
width

=
"20"
>

<
span class

=
"dropdown-caret"
>

<
/
span >

<
/
summary >

<
details-menu class

=
"dropdown-menu dropdown-menu-sw mt-2"
style

=
"width: 180px"
>

<
div class

=
"header-nav-current-user css-truncate"
>

<
a role

=
"menuitem"
class

=
"no-underline user-profile-link px-3 pt-2 pb-2 mb-n2 mt-n1 d-block"
href

=
"/lyz921225"
data-ga-click

=
"Header, go to profile, text:Signed in as"
> Signed in as

<
strong class

=
"css-truncate-target"
> lyz921225

<
/
strong >

<
/
a >

<
/
div >

<
div role

=
"none"
class

=
"dropdown-divider"
>

<
/
div >

<
div class

=
"pl-3 pr-5 f6 user-status-container js-user-status-context pb-1"
data-url

=
"/users/status?compact=1&amp;link_mentions=0&amp;truncate=1"
>

<
div class

=
"js-user-status-container user-status-compact"
data-team-hovercards-enabled >

<
details class

=
"js-user-status-details details-reset details-overlay details-overlay-dark"
>

<
summary class

=
"btn-link no-underline js-toggle-user-status-edit toggle-user-status-edit width-full"
aria-haspopup

=
"dialog"
role

=
"menuitem"
data-hydro-click

=
"{&quot;event_type&quot;:&quot;user_profile.click&quot;,&quot;payload&quot;:{&quot;profile_user_id&quot;:9447187,&quot;target&quot;:&quot;EDIT_USER_STATUS&quot;,&quot;user_id&quot;:26736994,&quot;client_id&quot;:&quot;758420693.1552373032&quot;,&quot;originating_request_id&quot;:&quot;BFC7:36FC:1DF679:3C017A:5CAC6DA0&quot;,&quot;originating_url&quot;:&quot;https://github.com/dunizb/CodeTest/blob/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css&quot;,&quot;referrer&quot;:&quot;https://github.com/dunizb/CodeTest/tree/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css&quot;}}"
data-hydro-click-hmac

=
"90cca3c97c92ee805ecb80b5ac7e90c1d994ffa208fcaf60d51ac660a2044bf6"
>

<
div class

=
"f6 d-inline-block v-align-middle  user-status-emoji-only-header pl-0 circle lh-condensed user-status-header "
style

=
"max-width: 29px"
>

<
div class

=
"user-status-emoji-container flex-shrink-0 mr-1"
>

<
svg class

=
"octicon octicon-smiley"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"16"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M8 0C3.58 0 0 3.58 0 8s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8zm4.81 12.81a6.72 6.72 0 0 1-2.17 1.45c-.83.36-1.72.53-2.64.53-.92 0-1.81-.17-2.64-.53-.81-.34-1.55-.83-2.17-1.45a6.773 6.773 0 0 1-1.45-2.17A6.59 6.59 0 0 1 1.21 8c0-.92.17-1.81.53-2.64.34-.81.83-1.55 1.45-2.17.62-.62 1.36-1.11 2.17-1.45A6.59 6.59 0 0 1 8 1.21c.92 0 1.81.17 2.64.53.81.34 1.55.83 2.17 1.45.62.62 1.11 1.36 1.45 2.17.36.83.53 1.72.53 2.64 0 .92-.17 1.81-.53 2.64-.34.81-.83 1.55-1.45 2.17zM4 6.8v-.59c0-.66.53-1.19 1.2-1.19h.59c.66 0 1.19.53 1.19 1.19v.59c0 .67-.53 1.2-1.19 1.2H5.2C4.53 8 4 7.47 4 6.8zm5 0v-.59c0-.66.53-1.19 1.2-1.19h.59c.66 0 1.19.53 1.19 1.19v.59c0 .67-.53 1.2-1.19 1.2h-.59C9.53 8 9 7.47 9 6.8zm4 3.2c-.72 1.88-2.91 3-5 3s-4.28-1.13-5-3c-.14-.39.23-1 .66-1h8.59c.41 0 .89.61.75 1z"
/
>

<
/
svg >

<
/
div >

<
/
div >

<
div class

=
"d-inline-block v-align-middle user-status-message-wrapper f6 lh-condensed ws-normal pt-1"
>

<
span class

=
"link-gray"
> Set your status

<
/
span >

<
/
div >

<
/
summary >

<
details-dialog class

=
"details-dialog rounded-1 anim-fade-in fast Box Box--overlay"
role

=
"dialog"
tabindex

=
"-1"
>

<!--
'"` --><!-- </textarea></xmp> --></option></form><form class="position-relative flex-auto js-user-status-form" action="/users/status?compact=1&amp;link_mentions=0&amp;truncate=1" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="_method" value="put" /><input type="hidden" name="authenticity_token" value="ZN6yFXNZbjXS1oblZaLBrIqbOYBL534WOC2l+8ax3bLoZTb+SrmMoXpchXE5vydkS7cS79uR8UAqHofJzYk0Sw==" />
<
div class

=
"Box-header bg-gray border-bottom p-3"
>

<
button class

=
"Box-btn-octicon js-toggle-user-status-edit btn-octicon float-right"
type

=
"reset"
aria-label

=
"Close dialog"
data-close-dialog >

<
svg class

=
"octicon octicon-x"
viewBox

=
"0 0 12 16"
version

=
"1.1"
width

=
"12"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48L7.48 8z"
/
>

<
/
svg >

<
/
button >

<
h3 class

=
"Box-title f5 text-bold text-gray-dark"
> Edit status

<
/
h3 >

<
/
div >

<
input type

=
"hidden"
name

=
"emoji"
class

=
"js-user-status-emoji-field"
value

=
""
>

<
input type

=
"hidden"
name

=
"organization_id"
class

=
"js-user-status-org-id-field"
value

=
""
>

<
div class

=
"px-3 py-2 text-gray-dark"
>

<
div class

=
"js-characters-remaining-container js-suggester-container position-relative mt-2"
>

<
div class

=
"input-group d-table form-group my-0 js-user-status-form-group"
>

<
span class

=
"input-group-button d-table-cell v-align-middle"
style

=
"width: 1%"
>

<
button type

=
"button"
aria-label

=
"Choose an emoji"
class

=
"btn-outline btn js-toggle-user-status-emoji-picker bg-white btn-open-emoji-picker"
>

<
span class

=
"js-user-status-original-emoji"
hidden >

<
/
span >

<
span class

=
"js-user-status-custom-emoji"
>

<
/
span >

<
span class

=
"js-user-status-no-emoji-icon"
>

<
svg class

=
"octicon octicon-smiley"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"16"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M8 0C3.58 0 0 3.58 0 8s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8zm4.81 12.81a6.72 6.72 0 0 1-2.17 1.45c-.83.36-1.72.53-2.64.53-.92 0-1.81-.17-2.64-.53-.81-.34-1.55-.83-2.17-1.45a6.773 6.773 0 0 1-1.45-2.17A6.59 6.59 0 0 1 1.21 8c0-.92.17-1.81.53-2.64.34-.81.83-1.55 1.45-2.17.62-.62 1.36-1.11 2.17-1.45A6.59 6.59 0 0 1 8 1.21c.92 0 1.81.17 2.64.53.81.34 1.55.83 2.17 1.45.62.62 1.11 1.36 1.45 2.17.36.83.53 1.72.53 2.64 0 .92-.17 1.81-.53 2.64-.34.81-.83 1.55-1.45 2.17zM4 6.8v-.59c0-.66.53-1.19 1.2-1.19h.59c.66 0 1.19.53 1.19 1.19v.59c0 .67-.53 1.2-1.19 1.2H5.2C4.53 8 4 7.47 4 6.8zm5 0v-.59c0-.66.53-1.19 1.2-1.19h.59c.66 0 1.19.53 1.19 1.19v.59c0 .67-.53 1.2-1.19 1.2h-.59C9.53 8 9 7.47 9 6.8zm4 3.2c-.72 1.88-2.91 3-5 3s-4.28-1.13-5-3c-.14-.39.23-1 .66-1h8.59c.41 0 .89.61.75 1z"
/
>

<
/
svg >

<
/
span >

<
/
button >

<
/
span >

<
input type

=
"text"
autocomplete

=
"off"
data-maxlength

=
"80"
class

=
"js-suggester-field d-table-cell width-full form-control js-user-status-message-field js-characters-remaining-field"
placeholder

=
"What's happening?"
name

=
"message"
required value

=
""
aria-label

=
"What is your current status?"
>

<
div class

=
"error"
> Could not update your status, please try again.

<
/
div >

<
/
div >

<
div class

=
"suggester-container"
>

<
div class

=
"suggester js-suggester js-navigation-container"
data-url

=
"/autocomplete/user-suggestions"
data-no-org-url

=
"/autocomplete/user-suggestions"
data-org-url

=
"/suggestions"
hidden >

<
/
div >

<
/
div >

<
div style

=
"margin-left: 53px"
class

=
"my-1 text-small label-characters-remaining js-characters-remaining"
data-suffix

=
"remaining"
hidden >

80
remaining

<
/
div >

<
/
div >

<
include-fragment class

=
"js-user-status-emoji-picker"
data-url

=
"/users/status/emoji"
>

<
/
include-fragment >

<
div class

=
"overflow-auto border-bottom ml-n3 mr-n3 px-3"
style

=
"max-height: 33vh"
>

<
div class

=
"user-status-suggestions js-user-status-suggestions collapsed overflow-hidden"
>

<
h4 class

=
"f6 text-normal my-3"
> Suggestions:

<
/
h4 >

<
div class

=
"mx-3 mt-2 clearfix"
>

<
div class

=
"float-left col-6"
>

<
button type

=
"button"
value

=
":palm_tree:"
class

=
"d-flex flex-items-baseline flex-items-stretch lh-condensed f6 btn-link link-gray no-underline js-predefined-user-status mb-1"
>

<
div class

=
"emoji-status-width mr-2 v-align-middle js-predefined-user-status-emoji"
>

<
g-emoji alias

=
"palm_tree"
fallback-src

=
"https://github.githubassets.com/images/icons/emoji/unicode/1f334.png"
> 🌴

<
/
g-emoji >

<
/
div >

<
div class

=
"d-flex flex-items-center no-underline js-predefined-user-status-message"
style

=
"border-left: 1px solid transparent"
>
On vacation

<
/
div >

<
/
button >

<
button type

=
"button"
value

=
":face_with_thermometer:"
class

=
"d-flex flex-items-baseline flex-items-stretch lh-condensed f6 btn-link link-gray no-underline js-predefined-user-status mb-1"
>

<
div class

=
"emoji-status-width mr-2 v-align-middle js-predefined-user-status-emoji"
>

<
g-emoji alias

=
"face_with_thermometer"
fallback-src

=
"https://github.githubassets.com/images/icons/emoji/unicode/1f912.png"
> 🤒

<
/
g-emoji >

<
/
div >

<
div class

=
"d-flex flex-items-center no-underline js-predefined-user-status-message"
style

=
"border-left: 1px solid transparent"
>
Out sick

<
/
div >

<
/
button >

<
/
div >

<
div class

=
"float-left col-6"
>

<
button type

=
"button"
value

=
":house:"
class

=
"d-flex flex-items-baseline flex-items-stretch lh-condensed f6 btn-link link-gray no-underline js-predefined-user-status mb-1"
>

<
div class

=
"emoji-status-width mr-2 v-align-middle js-predefined-user-status-emoji"
>

<
g-emoji alias

=
"house"
fallback-src

=
"https://github.githubassets.com/images/icons/emoji/unicode/1f3e0.png"
> 🏠

<
/
g-emoji >

<
/
div >

<
div class

=
"d-flex flex-items-center no-underline js-predefined-user-status-message"
style

=
"border-left: 1px solid transparent"
>
Working from home

<
/
div >

<
/
button >

<
button type

=
"button"
value

=
":dart:"
class

=
"d-flex flex-items-baseline flex-items-stretch lh-condensed f6 btn-link link-gray no-underline js-predefined-user-status mb-1"
>

<
div class

=
"emoji-status-width mr-2 v-align-middle js-predefined-user-status-emoji"
>

<
g-emoji alias

=
"dart"
fallback-src

=
"https://github.githubassets.com/images/icons/emoji/unicode/1f3af.png"
> 🎯

<
/
g-emoji >

<
/
div >

<
div class

=
"d-flex flex-items-center no-underline js-predefined-user-status-message"
style

=
"border-left: 1px solid transparent"
>
Focusing

<
/
div >

<
/
button >

<
/
div >

<
/
div >

<
/
div >

<
div class

=
"user-status-limited-availability-container"
>

<
div class

=
"form-checkbox my-0"
>

<
input type

=
"checkbox"
name

=
"limited_availability"
value

=
"1"
class

=
"js-user-status-limited-availability-checkbox"
data-default-message

=
"I may be slow to respond."
aria-describedby

=
"limited-availability-help-text-truncate-true"
id

=
"limited-availability-truncate-true"
>

<
label class

=
"d-block f5 text-gray-dark mb-1"
for

=
"limited-availability-truncate-true"
>
Busy

<
/
label >

<
p class

=
"note"
id

=
"limited-availability-help-text-truncate-true"
>
When others mention you, assign you, or request your review,
GitHub will let them know that you have limited availability.

<
/
p >

<
/
div >

<
/
div >

<
/
div >


<
div class

=
"d-inline-block f5 mr-2 pt-3 pb-2"
>

<
div class

=
"d-inline-block mr-1"
>
Clear status

<
/
div >

<
details class

=
"js-user-status-expire-drop-down f6 dropdown details-reset details-overlay d-inline-block mr-2"
>

<
summary class

=
"f5 btn-link link-gray-dark border px-2 py-1 rounded-1"
aria-haspopup

=
"true"
>

<
div class

=
"js-user-status-expiration-interval-selected d-inline-block v-align-baseline"
>
Never

<
/
div >

<
div class

=
"dropdown-caret"
>

<
/
div >

<
/
summary >

<
ul class

=
"dropdown-menu dropdown-menu-se pl-0 overflow-auto"
style

=
"width: 220px; max-height: 15.5em"
>

<
li >

<
button type

=
"button"
class

=
"btn-link dropdown-item js-user-status-expire-button ws-normal"
title

=
"Never"
>

<
span class

=
"d-inline-block text-bold mb-1"
> Never

<
/
span >

<
div class

=
"f6 lh-condensed"
> Keep this status until you clear your status or edit your status.

<
/
div >

<
/
button >

<
/
li >

<
li class

=
"dropdown-divider"
role

=
"separator"
>

<
/
li >

<
li >

<
button type

=
"button"
class

=
"btn-link dropdown-item ws-normal js-user-status-expire-button"
title

=
"in 30 minutes"
value

=
"2019-04-09T18:32:14+08:00"
>
in

30
minutes

<
/
button >

<
/
li >

<
li >

<
button type

=
"button"
class

=
"btn-link dropdown-item ws-normal js-user-status-expire-button"
title

=
"in 1 hour"
value

=
"2019-04-09T19:02:14+08:00"
>
in

1
hour

<
/
button >

<
/
li >

<
li >

<
button type

=
"button"
class

=
"btn-link dropdown-item ws-normal js-user-status-expire-button"
title

=
"in 4 hours"
value

=
"2019-04-09T22:02:14+08:00"
>
in

4
hours

<
/
button >

<
/
li >

<
li >

<
button type

=
"button"
class

=
"btn-link dropdown-item ws-normal js-user-status-expire-button"
title

=
"today"
value

=
"2019-04-09T23:59:59+08:00"
>
today

<
/
button >

<
/
li >

<
li >

<
button type

=
"button"
class

=
"btn-link dropdown-item ws-normal js-user-status-expire-button"
title

=
"this week"
value

=
"2019-04-14T23:59:59+08:00"
>
this week

<
/
button >

<
/
li >

<
/
ul >

<
/
details >

<
input class

=
"js-user-status-expiration-date-input"
type

=
"hidden"
name

=
"expires_at"
value

=
""
>

<
/
div >

<
include-fragment class

=
"js-user-status-org-picker"
data-url

=
"/users/status/organizations"
>

<
/
include-fragment >

<
/
div >

<
div class

=
"d-flex flex-items-center flex-justify-between p-3 border-top"
>

<
button type

=
"submit"
disabled class

=
"width-full btn btn-primary mr-2 js-user-status-submit"
>
Set status

<
/
button >

<
button type

=
"button"
disabled class

=
"width-full js-clear-user-status-button btn ml-2 "
>
Clear status

<
/
button >

<
/
div >

<
/
form >

<
/
details-dialog >

<
/
details >

<
/
div >

<
/
div >

<
div role

=
"none"
class

=
"dropdown-divider"
>

<
/
div >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/lyz921225"
data-ga-click

=
"Header, go to profile, text:your profile"
> Your profile

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/lyz921225?tab=repositories"
data-ga-click

=
"Header, go to repositories, text:your repositories"
> Your repositories

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/lyz921225?tab=projects"
data-ga-click

=
"Header, go to projects, text:your projects"
> Your projects

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/lyz921225?tab=stars"
data-ga-click

=
"Header, go to starred repos, text:your stars"
> Your stars

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"https://gist.github.com/"
data-ga-click

=
"Header, your gists, text:your gists"
> Your gists

<
/
a >

<
div role

=
"none"
class

=
"dropdown-divider"
>

<
/
div >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"https://help.github.com"
data-ga-click

=
"Header, go to help, text:help"
> Help

<
/
a >

<
a role

=
"menuitem"
class

=
"dropdown-item"
href

=
"/settings/profile"
data-ga-click

=
"Header, go to settings, icon:settings"
> Settings

<
/
a >

<!--
'"` --><!-- </textarea></xmp> --></option></form><form class="logout-form" action="/logout" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="P+3zegCfPX/hFLhBl4mHgg+IyJN7hc7iovwATmvkfMv/8X4masmcnfh7Frb1vK3lyW/2EE9xAAy22spH+ISCSg==" />

<
button type

=
"submit"
class

=
"dropdown-item dropdown-signout"
data-ga-click

=
"Header, sign out, icon:logout"
role

=
"menuitem"
>
Sign out

<
/
button >

<
/
form >

<
/
details-menu >

<
/
details >

<
/
div >

<
/
header >


<
/
div >

<
div id

=
"start-of-content"
class

=
"show-on-focus"
>

<
/
div >

<
div id

=
"js-flash-container"
>

<
/
div >


<
div class

=
"application-main "
data-commit-hovercards-enabled >

<
div itemscope itemtype

=
"http://schema.org/SoftwareSourceCode"
class

=
""
>

<
main id

=
"js-repo-pjax-container"
data-pjax-container >


<
div class

=
"pagehead repohead instapaper_ignore readability-menu experiment-repo-nav  "
>

<
div class

=
"repohead-details-container clearfix container"
>

<
ul class

=
"pagehead-actions"
>


<
li >

<!--
'"` --><!-- </textarea></xmp> --></option></form><form data-remote="true" class="clearfix js-social-form js-social-container" action="/notifications/subscribe" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="T25dvQybTOHi/o/TfUYyPBulvgZ6M/gp9lz4TyYv7djWUWruwg+wDCrjqgl+bP9JuFUnygIQv2DVkolkHSAMpQ==" />      <input type="hidden" name="repository_id" value="63790490">

<
details class

=
"details-reset details-overlay select-menu float-left"
>

<
summary class

=
"select-menu-button float-left btn btn-sm btn-with-count"
data-hydro-click

=
"{&quot;event_type&quot;:&quot;repository.click&quot;,&quot;payload&quot;:{&quot;target&quot;:&quot;WATCH_BUTTON&quot;,&quot;repository_id&quot;:63790490,&quot;client_id&quot;:&quot;758420693.1552373032&quot;,&quot;originating_request_id&quot;:&quot;BFC7:36FC:1DF679:3C017A:5CAC6DA0&quot;,&quot;originating_url&quot;:&quot;https://github.com/dunizb/CodeTest/blob/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css&quot;,&quot;referrer&quot;:&quot;https://github.com/dunizb/CodeTest/tree/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css&quot;,&quot;user_id&quot;:26736994}}"
data-hydro-click-hmac

=
"7f178103f587165ecf33e149b6276ba6b74924f602f9456abb00012c104d632f"
data-ga-click

=
"Repository, click Watch settings, action:blob#show"
>

<
span data-menu-button >

<
svg class

=
"octicon octicon-eye v-align-text-bottom"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"16"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M8.06 2C3 2 0 8 0 8s3 6 8.06 6C13 14 16 8 16 8s-3-6-7.94-6zM8 12c-2.2 0-4-1.78-4-4 0-2.2 1.8-4 4-4 2.22 0 4 1.8 4 4 0 2.22-1.78 4-4 4zm2-4c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"
/
>

<
/
svg >
Watch

<
/
span >

<
/
summary >

<
details-menu
class

=
"select-menu-modal position-absolute mt-5"
style

=
"z-index: 99; "
>

<
div class

=
"select-menu-header"
>

<
span class

=
"select-menu-title"
> Notifications

<
/
span >

<
/
div >

<
div class

=
"select-menu-list"
>

<
button type

=
"submit"
name

=
"do"
value

=
"included"
class

=
"select-menu-item width-full"
aria-checked

=
"true"
role

=
"menuitemradio"
>

<
svg class

=
"octicon octicon-check select-menu-item-icon"
viewBox

=
"0 0 12 16"
version

=
"1.1"
width

=
"12"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M12 5l-8 8-4-4 1.5-1.5L4 10l6.5-6.5L12 5z"
/
>

<
/
svg >

<
div class

=
"select-menu-item-text"
>

<
span class

=
"select-menu-item-heading"
> Not watching

<
/
span >

<
span class

=
"description"
> Be notified only when participating or

@mentioned.</span>
<span class="hidden-select-button-text" data-menu-button-contents>
<svg class="octicon octicon-eye v-align-text-bottom" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M8.06 2C3 2 0 8 0 8s3 6 8.06 6C13 14 16 8 16 8s-3-6-7.94-6zM8 12c-2.2 0-4-1.78-4-4 0-2.2 1.8-4 4-4 2.22 0 4 1.8 4 4 0 2.22-1.78 4-4 4zm2-4c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg>
Watch
</span>
</div>
</button>

<button type="submit" name="do" value="release_only" class="select-menu-item width-full" aria-checked="false" role="menuitemradio">
<svg class="octicon octicon-check select-menu-item-icon" viewBox="0 0 12 16" version="1.1" width="12" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M12 5l-8 8-4-4 1.5-1.5L4 10l6.5-6.5L12 5z"/></svg>
<div class="select-menu-item-text">
<span class="select-menu-item-heading">Releases only</span>
<span class="description">Be notified of new releases, and when participating or @mentioned.</span>
<span class="hidden-select-button-text" data-menu-button-contents>
<svg class="octicon octicon-eye v-align-text-bottom" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M8.06 2C3 2 0 8 0 8s3 6 8.06 6C13 14 16 8 16 8s-3-6-7.94-6zM8 12c-2.2 0-4-1.78-4-4 0-2.2 1.8-4 4-4 2.22 0 4 1.8 4 4 0 2.22-1.78 4-4 4zm2-4c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg>
Unwatch releases
</span>
</div>
</button>

<button type="submit" name="do" value="subscribed" class="select-menu-item width-full" aria-checked="false" role="menuitemradio">
<svg class="octicon octicon-check select-menu-item-icon" viewBox="0 0 12 16" version="1.1" width="12" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M12 5l-8 8-4-4 1.5-1.5L4 10l6.5-6.5L12 5z"/></svg>
<div class="select-menu-item-text">
<span class="select-menu-item-heading">Watching</span>
<span class="description">Be notified of all conversations.</span>
<span class="hidden-select-button-text" data-menu-button-contents>
<svg class="octicon octicon-eye v-align-text-bottom" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M8.06 2C3 2 0 8 0 8s3 6 8.06 6C13 14 16 8 16 8s-3-6-7.94-6zM8 12c-2.2 0-4-1.78-4-4 0-2.2 1.8-4 4-4 2.22 0 4 1.8 4 4 0 2.22-1.78 4-4 4zm2-4c0 1.11-.89 2-2 2-1.11 0-2-.89-2-2 0-1.11.89-2 2-2 1.11 0 2 .89 2 2z"/></svg>
Unwatch
</span>
</div>
</button>

<button type="submit" name="do" value="ignore" class="select-menu-item width-full" aria-checked="false" role="menuitemradio">
<svg class="octicon octicon-check select-menu-item-icon" viewBox="0 0 12 16" version="1.1" width="12" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M12 5l-8 8-4-4 1.5-1.5L4 10l6.5-6.5L12 5z"/></svg>
<div class="select-menu-item-text">
<span class="select-menu-item-heading">Ignoring</span>
<span class="description">Never be notified.</span>
<span class="hidden-select-button-text" data-menu-button-contents>
<svg class="octicon octicon-mute v-align-text-bottom" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M8 2.81v10.38c0 .67-.81 1-1.28.53L3 10H1c-.55 0-1-.45-1-1V7c0-.55.45-1 1-1h2l3.72-3.72C7.19 1.81 8 2.14 8 2.81zm7.53 3.22l-1.06-1.06-1.97 1.97-1.97-1.97-1.06 1.06L11.44 8 9.47 9.97l1.06 1.06 1.97-1.97 1.97 1.97 1.06-1.06L13.56 8l1.97-1.97z"/></svg>
Stop ignoring
</span>
</div>
</button>

</div>
</details-menu>
</details>
<a class="social-count js-social-count"
href="/dunizb/CodeTest/watchers"
aria-label="19 users are watching this repository">
19
</a>
</form>
</li>

<li>
<div class="js-toggler-container js-social-container starring-container ">
<!-- '"` --><!-- </textarea></xmp> --></option></form><form class="starred js-social-form" action="/dunizb/CodeTest/unstar" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="mfPXA71D1BJW0SFn3jEa2iyFyJg2Fq2PzhkhMuT/J391H5Wl4b4HdoTOMzFL+pb7VSYJI0Lhb2iuErn5/RqjBA==" />
<input type="hidden" name="context" value="repository"></input>
<button type="submit" class="btn btn-sm btn-with-count js-toggler-target" aria-label="Unstar this repository" title="Unstar dunizb/CodeTest" data-hydro-click="{&quot;event_type&quot;:&quot;repository.click&quot;,&quot;payload&quot;:{&quot;target&quot;:&quot;UNSTAR_BUTTON&quot;,&quot;repository_id&quot;:63790490,&quot;client_id&quot;:&quot;758420693.1552373032&quot;,&quot;originating_request_id&quot;:&quot;BFC7:36FC:1DF679:3C017A:5CAC6DA0&quot;,&quot;originating_url&quot;:&quot;https://github.com/dunizb/CodeTest/blob/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css&quot;,&quot;referrer&quot;:&quot;https://github.com/dunizb/CodeTest/tree/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css&quot;,&quot;user_id&quot;:26736994}}" data-hydro-click-hmac="87f6e2f772baee68b707c565a38da88fb2e9de37a8585a290bcb932caa1cd1e0" data-ga-click="Repository, click unstar button, action:blob#show; text:Unstar">        <svg class="octicon octicon-star v-align-text-bottom" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"/></svg>
Unstar
</button>        <a class="social-count js-social-count" href="/dunizb/CodeTest/stargazers"
aria-label="144 users starred this repository">
144
</a>
</form>
<!-- '"` --><!-- </textarea></xmp> --></option></form><form class="unstarred js-social-form" action="/dunizb/CodeTest/star" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="8AjkzkmMRRFPFTCEYbP4A5OfM+Clyp48ow9762CupB39M81Q87qHlQWoGxYFft3yhFESyKp9Sbs5xt4nCMCOqA==" />
<input type="hidden" name="context" value="repository"></input>
<button type="submit" class="btn btn-sm btn-with-count js-toggler-target" aria-label="Unstar this repository" title="Star dunizb/CodeTest" data-hydro-click="{&quot;event_type&quot;:&quot;repository.click&quot;,&quot;payload&quot;:{&quot;target&quot;:&quot;STAR_BUTTON&quot;,&quot;repository_id&quot;:63790490,&quot;client_id&quot;:&quot;758420693.1552373032&quot;,&quot;originating_request_id&quot;:&quot;BFC7:36FC:1DF679:3C017A:5CAC6DA0&quot;,&quot;originating_url&quot;:&quot;https://github.com/dunizb/CodeTest/blob/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css&quot;,&quot;referrer&quot;:&quot;https://github.com/dunizb/CodeTest/tree/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css&quot;,&quot;user_id&quot;:26736994}}" data-hydro-click-hmac="76836c8bfb7a4799ce833f56b0a92ba60f91d192f2976a99197f6693afaadc33" data-ga-click="Repository, click star button, action:blob#show; text:Star">        <svg class="octicon octicon-star v-align-text-bottom" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M14 6l-4.9-.64L7 1 4.9 5.36 0 6l3.6 3.26L2.67 14 7 11.67 11.33 14l-.93-4.74L14 6z"/></svg>
Star
</button>        <a class="social-count js-social-count" href="/dunizb/CodeTest/stargazers"
aria-label="144 users starred this repository">
144
</a>
</form>  </div>

</li>

<li>
<!-- '"` --><!-- </textarea></xmp> --></option></form><form class="btn-with-count" action="/dunizb/CodeTest/fork" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="50cTgBFe+t9Ka7ROYpg9MpjotFBxv5cOLH6tqOAUDIGs+vpp+QmM5UoLzc9WPhqTRBHlQx+M4hLZR/hzywiJHg==" />
<button class="btn btn-sm btn-with-count" data-hydro-click="{&quot;event_type&quot;:&quot;repository.click&quot;,&quot;payload&quot;:{&quot;target&quot;:&quot;FORK_BUTTON&quot;,&quot;repository_id&quot;:63790490,&quot;client_id&quot;:&quot;758420693.1552373032&quot;,&quot;originating_request_id&quot;:&quot;BFC7:36FC:1DF679:3C017A:5CAC6DA0&quot;,&quot;originating_url&quot;:&quot;https://github.com/dunizb/CodeTest/blob/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css&quot;,&quot;referrer&quot;:&quot;https://github.com/dunizb/CodeTest/tree/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css&quot;,&quot;user_id&quot;:26736994}}" data-hydro-click-hmac="ea8c25122eff61328ae8cd83f40a8bcc1300ece84a2ceffa811fef61547e4959" data-ga-click="Repository, show fork modal, action:blob#show; text:Fork" type="submit" title="Fork your own copy of dunizb/CodeTest to your account" aria-label="Fork your own copy of dunizb/CodeTest to your account">              <svg class="octicon octicon-repo-forked v-align-text-bottom" viewBox="0 0 10 16" version="1.1" width="10" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M8 1a1.993 1.993 0 0 0-1 3.72V6L5 8 3 6V4.72A1.993 1.993 0 0 0 2 1a1.993 1.993 0 0 0-1 3.72V6.5l3 3v1.78A1.993 1.993 0 0 0 5 15a1.993 1.993 0 0 0 1-3.72V9.5l3-3V4.72A1.993 1.993 0 0 0 8 1zM2 4.2C1.34 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm3 10c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zm3-10c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"/></svg>
Fork
</button></form>
<a href="/dunizb/CodeTest/network/members" class="social-count"
aria-label="265 users forked this repository">
265
</a>
</li>
</ul>

<h1 class="public ">
<svg class="octicon octicon-repo" viewBox="0 0 12 16" version="1.1" width="12" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M4 9H3V8h1v1zm0-3H3v1h1V6zm0-2H3v1h1V4zm0-2H3v1h1V2zm8-1v12c0 .55-.45 1-1 1H6v2l-1.5-1.5L3 16v-2H1c-.55 0-1-.45-1-1V1c0-.55.45-1 1-1h10c.55 0 1 .45 1 1zm-1 10H1v2h2v-1h3v1h5v-2zm0-10H2v9h9V1z"/></svg>
<span class="author" itemprop="author"><a class="url fn" rel="author" data-hovercard-type="user" data-hovercard-url="/hovercards?user_id=9447187" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="/dunizb">dunizb</a></span><!--
--><span class="path-divider">/</span><!--
--><strong itemprop="name"><a data-pjax="#js-repo-pjax-container" href="/dunizb/CodeTest">CodeTest</a></strong>

</h1>

</div>

<nav class="reponav js-repo-nav js-sidenav-container-pjax container"
itemscope
itemtype="http://schema.org/BreadcrumbList"
aria-label="Repository"
data-pjax="#js-repo-pjax-container">

<span itemscope itemtype="http://schema.org/ListItem" itemprop="itemListElement">
<a class="js-selected-navigation-item selected reponav-item" itemprop="url" data-hotkey="g c" aria-current="page" data-selected-links="repo_source repo_downloads repo_commits repo_releases repo_tags repo_branches repo_packages /dunizb/CodeTest" href="/dunizb/CodeTest">
<svg class="octicon octicon-code" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M9.5 3L8 4.5 11.5 8 8 11.5 9.5 13 14 8 9.5 3zm-5 0L0 8l4.5 5L6 11.5 2.5 8 6 4.5 4.5 3z"/></svg>
<span itemprop="name">Code</span>
<meta itemprop="position" content="1">
</a>  </span>

<span itemscope itemtype="http://schema.org/ListItem" itemprop="itemListElement">
<a itemprop="url" data-hotkey="g i" class="js-selected-navigation-item reponav-item" data-selected-links="repo_issues repo_labels repo_milestones /dunizb/CodeTest/issues" href="/dunizb/CodeTest/issues">
<svg class="octicon octicon-issue-opened" viewBox="0 0 14 16" version="1.1" width="14" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"/></svg>
<span itemprop="name">Issues</span>
<span class="Counter">0</span>
<meta itemprop="position" content="2">
</a>    </span>

<span itemscope itemtype="http://schema.org/ListItem" itemprop="itemListElement">
<a data-hotkey="g p" itemprop="url" class="js-selected-navigation-item reponav-item" data-selected-links="repo_pulls checks /dunizb/CodeTest/pulls" href="/dunizb/CodeTest/pulls">
<svg class="octicon octicon-git-pull-request" viewBox="0 0 12 16" version="1.1" width="12" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M11 11.28V5c-.03-.78-.34-1.47-.94-2.06C9.46 2.35 8.78 2.03 8 2H7V0L4 3l3 3V4h1c.27.02.48.11.69.31.21.2.3.42.31.69v6.28A1.993 1.993 0 0 0 10 15a1.993 1.993 0 0 0 1-3.72zm-1 2.92c-.66 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2zM4 3c0-1.11-.89-2-2-2a1.993 1.993 0 0 0-1 3.72v6.56A1.993 1.993 0 0 0 2 15a1.993 1.993 0 0 0 1-3.72V4.72c.59-.34 1-.98 1-1.72zm-.8 10c0 .66-.55 1.2-1.2 1.2-.65 0-1.2-.55-1.2-1.2 0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2zM2 4.2C1.34 4.2.8 3.65.8 3c0-.65.55-1.2 1.2-1.2.65 0 1.2.55 1.2 1.2 0 .65-.55 1.2-1.2 1.2z"/></svg>
<span itemprop="name">Pull requests</span>
<span class="Counter">0</span>
<meta itemprop="position" content="3">
</a>  </span>



<a data-hotkey="g b" class="js-selected-navigation-item reponav-item" data-selected-links="repo_projects new_repo_project repo_project /dunizb/CodeTest/projects" href="/dunizb/CodeTest/projects">
<svg class="octicon octicon-project" viewBox="0 0 15 16" version="1.1" width="15" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M10 12h3V2h-3v10zm-4-2h3V2H6v8zm-4 4h3V2H2v12zm-1 1h13V1H1v14zM14 0H1a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h13a1 1 0 0 0 1-1V1a1 1 0 0 0-1-1z"/></svg>
Projects
<span class="Counter" >0</span>
</a>

<a class="js-selected-navigation-item reponav-item" data-hotkey="g w" data-selected-links="repo_wiki /dunizb/CodeTest/wiki" href="/dunizb/CodeTest/wiki">
<svg class="octicon octicon-book" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M3 5h4v1H3V5zm0 3h4V7H3v1zm0 2h4V9H3v1zm11-5h-4v1h4V5zm0 2h-4v1h4V7zm0 2h-4v1h4V9zm2-6v9c0 .55-.45 1-1 1H9.5l-1 1-1-1H2c-.55 0-1-.45-1-1V3c0-.55.45-1 1-1h5.5l1 1 1-1H15c.55 0 1 .45 1 1zm-8 .5L7.5 3H2v9h6V3.5zm7-.5H9.5l-.5.5V12h6V3z"/></svg>
Wiki
</a>
<a class="js-selected-navigation-item reponav-item" data-selected-links="repo_graphs repo_contributors dependency_graph pulse people alerts /dunizb/CodeTest/pulse" href="/dunizb/CodeTest/pulse">
<svg class="octicon octicon-graph" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M16 14v1H0V0h1v14h15zM5 13H3V8h2v5zm4 0H7V3h2v10zm4 0h-2V6h2v7z"/></svg>
Insights
</a>

</nav>


</div>
<div class="container new-discussion-timeline experiment-repo-nav  ">
<div class="repository-content ">







<a class="d-none js-permalink-shortcut" data-hotkey="y" href="/dunizb/CodeTest/blob/05590b50bf7676cf0b958554b3ed7f54b37e0678/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css">Permalink</a>

<!-- blob contrib key: blob_contributors:v21:fbac5c860517811cd53bee3cf36befde -->



<div class="d-flex flex-shrink-0 flex-items-start mb-3">

<details class="details-reset details-overlay select-menu branch-select-menu ">
<summary class="btn btn-sm select-menu-button css-truncate"
data-hotkey="w"

title="Switch branches or tags">
<i>Branch:</i>
<span class="css-truncate-target">master</span>
</summary>

<details-menu class="select-menu-modal position-absolute" style="z-index: 99;" src="/dunizb/CodeTest/ref-list/master/HTML&amp;CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css?source_action=show&amp;source_controller=blob" preload>
<include-fragment class="select-menu-loading-overlay anim-pulse">
<svg height="32" class="octicon octicon-octoface" viewBox="0 0 16 16" version="1.1" width="32" aria-hidden="true"><path fill-rule="evenodd" d="M14.7 5.34c.13-.32.55-1.59-.13-3.31 0 0-1.05-.33-3.44 1.3-1-.28-2.07-.32-3.13-.32s-2.13.04-3.13.32c-2.39-1.64-3.44-1.3-3.44-1.3-.68 1.72-.26 2.99-.13 3.31C.49 6.21 0 7.33 0 8.69 0 13.84 3.33 15 7.98 15S16 13.84 16 8.69c0-1.36-.49-2.48-1.3-3.35zM8 14.02c-3.3 0-5.98-.15-5.98-3.35 0-.76.38-1.48 1.02-2.07 1.07-.98 2.9-.46 4.96-.46 2.07 0 3.88-.52 4.96.46.65.59 1.02 1.3 1.02 2.07 0 3.19-2.68 3.35-5.98 3.35zM5.49 9.01c-.66 0-1.2.8-1.2 1.78s.54 1.79 1.2 1.79c.66 0 1.2-.8 1.2-1.79s-.54-1.78-1.2-1.78zm5.02 0c-.66 0-1.2.79-1.2 1.78s.54 1.79 1.2 1.79c.66 0 1.2-.8 1.2-1.79s-.53-1.78-1.2-1.78z"/></svg>
</include-fragment>
</details-menu>
</details>

<h2 id="blob-path" class="breadcrumb flex-auto flex-self-center min-width-0 text-normal mx-2">
<span class="js-repo-root text-bold"><span class="js-path-segment"><a data-pjax="true" href="/dunizb/CodeTest"><span>CodeTest</span></a></span></span><span class="separator">/</span><span class="js-path-segment"><a data-pjax="true" href="/dunizb/CodeTest/tree/master/HTML%26CSS"><span>HTML&amp; CSS

<
/
span >

<
/
a >

<
/
span >

<
span class

=
"separator"
>

/
<
/
span >

<
span class

=
"js-path-segment"
>

<
a data-pjax

=
"true"
href

=
"/dunizb/CodeTest/tree/master/HTML%26CSS/html5"
>

<
span > html5

<
/
span >

<
/
a >

<
/
span >

<
span class

=
"separator"
>

/
<
/
span >

<
span class

=
"js-path-segment"
>

<
a data-pjax

=
"true"
href

=
"/dunizb/CodeTest/tree/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8"
>

<
span > 视频播放器

<
/
span >

<
/
a >

<
/
span >

<
span class

=
"separator"
>

/
<
/
span >

<
span class

=
"js-path-segment"
>

<
a data-pjax

=
"true"
href

=
"/dunizb/CodeTest/tree/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css"
>

<
span > css

<
/
span >

<
/
a >

<
/
span >

<
span class

=
"separator"
>

/
<
/
span >

<
strong class

=
"final-path"
> player.css

<
/
strong >

<
/
h2 >

<
div class

=
"BtnGroup d-flex flex-justify-end flex-shrink-0"
>

<
a href

=
"/dunizb/CodeTest/find/master"
class

=
"js-pjax-capture-input btn btn-sm BtnGroup-item"
data-pjax
data-hotkey

=
"t"
>
Find file

<
/
a >

<
clipboard-copy value

=
"HTML&amp;CSS/html5/视频播放器/css/player.css"
class

=
"btn btn-sm BtnGroup-item"
>
Copy path

<
/
clipboard-copy >

<
/
div >

<
/
div >


<
div class

=
"Box Box--condensed d-flex flex-column flex-shrink-0"
>

<
div class

=
"Box-body d-flex flex-justify-between bg-blue-light flex-items-center"
>

<
span class

=
"pr-md-4 f6"
>

<
a rel

=
"author"
data-skip-pjax

=
"true"
data-hovercard-type

=
"user"
data-hovercard-url

=
"/hovercards?user_id=9447187"
data-octo-click

=
"hovercard-link-click"
data-octo-dimensions

=
"link_type:self"
href

=
"/dunizb"
>

<
img class

=
"avatar"
src

=
"https://avatars1.githubusercontent.com/u/9447187?s=40&amp;v=4"
width

=
"20"
height

=
"20"
alt

=
"@dunizb"
/
>

<
/
a >

<
a class

=
"text-bold link-gray-dark lh-default v-align-middle"
rel

=
"author"
data-hovercard-type

=
"user"
data-hovercard-url

=
"/hovercards?user_id=9447187"
data-octo-click

=
"hovercard-link-click"
data-octo-dimensions

=
"link_type:self"
href

=
"/dunizb"
> dunizb

<
/
a >

<
span class

=
"lh-default v-align-middle"
>

<
a data-pjax

=
"true"
title

=
"first commint"
class

=
"link-gray"
href

=
"/dunizb/CodeTest/commit/122afba87661c53555c4d5b414b31797b50e2ee2"
> first commint

<
/
a >

<
/
span >

<
/
span >

<
span class

=
"d-inline-block flex-shrink-0 v-align-bottom f6"
>

<
a class

=
"pr-2 text-mono link-gray"
href

=
"/dunizb/CodeTest/commit/122afba87661c53555c4d5b414b31797b50e2ee2"
data-pjax >

122
afba

<
/
a >

<
relative-time datetime

=
"2016-07-20T15:07:15Z"
> Jul

20
,
2016
<
/
relative-time >

<
/
span >

<
/
div >

<
div class

=
"Box-body d-flex flex-items-center flex-auto f6 border-bottom-0"
>

<
details class

=
"details-reset details-overlay details-overlay-dark lh-default text-gray-dark float-left mr-2"
id

=
"blob_contributors_box"
>

<
summary class

=
"btn-link"
aria-haspopup

=
"dialog"
>

<
span >

<
strong >

1
<
/
strong > contributor

<
/
span >

<
/
summary >

<
details-dialog class

=
"Box Box--overlay d-flex flex-column anim-fade-in fast"
aria-label

=
"Users who have contributed to this file"
>

<
div class

=
"Box-header"
>

<
button class

=
"Box-btn-octicon btn-octicon float-right"
type

=
"button"
aria-label

=
"Close dialog"
data-close-dialog >

<
svg class

=
"octicon octicon-x"
viewBox

=
"0 0 12 16"
version

=
"1.1"
width

=
"12"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48L7.48 8z"
/
>

<
/
svg >

<
/
button >

<
h3 class

=
"Box-title"
>
Users who have contributed to this file

<
/
h3 >

<
/
div >

<
ul class

=
"list-style-none overflow-auto"
>

<
li class

=
"Box-row"
>

<
a class

=
"link-gray-dark no-underline"
href

=
"/dunizb"
>

<
img class

=
"avatar mr-1"
alt

=
""
src

=
"https://avatars1.githubusercontent.com/u/9447187?s=40&amp;v=4"
width

=
"20"
height

=
"20"
/
>
dunizb

<
/
a >

<
/
li >

<
/
ul >

<
/
details-dialog >

<
/
details >

<
/
div >

<
/
div >


<
div class

=
"Box mt-3 position-relative"
>

<
div class

=
"Box-header py-2 d-flex flex-justify-between flex-items-center"
>

<
div class

=
"text-mono f6"
>

127
lines

(
114
sloc

)
<
span class

=
"file-info-divider"
>

<
/
span >

1.68
KB

<
/
div >

<
div class

=
"d-flex"
>

<
div class

=
"BtnGroup"
>

<
a id

=
"raw-url"
class

=
"btn btn-sm BtnGroup-item"
href

=
"/dunizb/CodeTest/raw/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css"
> Raw

<
/
a >

<
a class

=
"btn btn-sm js-update-url-with-hash BtnGroup-item"
data-hotkey

=
"b"
href

=
"/dunizb/CodeTest/blame/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css"
> Blame

<
/
a >

<
a rel

=
"nofollow"
class

=
"btn btn-sm BtnGroup-item"
href

=
"/dunizb/CodeTest/commits/master/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css"
> History

<
/
a >

<
/
div >


<
div >

<
a class

=
"btn-octicon tooltipped tooltipped-nw "
href

=
"https://desktop.github.com"
aria-label

=
"Open this file in GitHub Desktop"
data-ga-click

=
"Repository, open with desktop, type:windows"
>

<
svg class

=
"octicon octicon-device-desktop"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"16"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M15 2H1c-.55 0-1 .45-1 1v9c0 .55.45 1 1 1h5.34c-.25.61-.86 1.39-2.34 2h8c-1.48-.61-2.09-1.39-2.34-2H15c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1zm0 9H1V3h14v8z"
/
>

<
/
svg >

<
/
a >

<!--
'"` --><!-- </textarea></xmp> --></option></form><form class="inline-form js-update-url-with-hash" action="/dunizb/CodeTest/edit/master/HTML&amp;CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="QF+Cx3tgvX4ThSPiGoXmjx3KJQioknrjzPK1thEAxVms6J0rCzSIYH4u+cf36IAoHGxMDrOJr2CZGIjJfda+gg==" />
<
button class

=
"btn-octicon tooltipped tooltipped-nw"
type

=
"submit"
aria-label

=
"Fork this project and edit the file"
data-hotkey

=
"e"
data-disable-with >

<
svg class

=
"octicon octicon-pencil"
viewBox

=
"0 0 14 16"
version

=
"1.1"
width

=
"14"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M0 12v3h3l8-8-3-3-8 8zm3 2H1v-2h1v1h1v1zm10.3-9.3L12 6 9 3l1.3-1.3a.996.996 0 0 1 1.41 0l1.59 1.59c.39.39.39 1.02 0 1.41z"
/
>

<
/
svg >

<
/
button >

<
/
form >

<!--
'"` --><!-- </textarea></xmp> --></option></form><form class="inline-form" action="/dunizb/CodeTest/delete/master/HTML&amp;CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="RkHvCJgE4smPr/ddfQcRrNitndHdis2mxKFYKjSFr3weCw4/UTKRyU1nL3KM/OPaBv5G6WBCy2yB0mmuLLfOYQ==" />
<
button class

=
"btn-octicon btn-octicon-danger tooltipped tooltipped-nw"
type

=
"submit"
aria-label

=
"Fork this project and delete the file"
data-disable-with >

<
svg class

=
"octicon octicon-trashcan"
viewBox

=
"0 0 12 16"
version

=
"1.1"
width

=
"12"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M11 2H9c0-.55-.45-1-1-1H5c-.55 0-1 .45-1 1H2c-.55 0-1 .45-1 1v1c0 .55.45 1 1 1v9c0 .55.45 1 1 1h7c.55 0 1-.45 1-1V5c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1zm-1 12H3V5h1v8h1V5h1v8h1V5h1v8h1V5h1v9zm1-10H2V3h9v1z"
/
>

<
/
svg >

<
/
button >

<
/
form >

<
/
div >

<
/
div >

<
/
div >


<
div itemprop

=
"text"
class

=
"Box-body p-0 blob-wrapper data type-css "
>

<
table class

=
"highlight tab-size js-file-line-container"
data-tab-size

=
"8"
>

<
tr >

<
td id

=
"L1"
class

=
"blob-num js-line-number"
data-line-number

=
"1"
>

<
/
td >

<
td id

=
"LC1"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-ent"
> body

<
/
span > {
< / td > < / tr > < tr > < td id = "L2" class = "blob-num js-line-number" data-line-number = "2" > < / td > < td id = "LC2" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > padding < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L3" class = "blob-num js-line-number" data-line-number = "3" > < / td > < td id = "LC3" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > margin < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L4" class = "blob-num js-line-number" data-line-number = "4" > < / td > < td id = "LC4" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > font-family < / span > < / span >: < span class = "pl-s" > < span class = "pl-pds" > & #39;
< / span > microsoft yahei < span class = "pl-pds" > & #39;
< / span > < / span >, < span class = "pl-s" > < span class = "pl-pds" > & #39;
< / span > Helvetica < span class = "pl-pds" > & #39;
< / span > < / span >, simhei, simsun, < span class = "pl-c1" > sans-serif < / span >;
< / td > < / tr > < tr > < td id = "L5" class = "blob-num js-line-number" data-line-number = "5" > < / td > < td id = "LC5" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > background-color < / span > < / span >: < span class = "pl-c1" > #F7F7F7 < / span >;
< / td > < / tr > < tr > < td id = "L6" class = "blob-num js-line-number" data-line-number = "6" > < / td > < td id = "LC6" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L7"
class

=
"blob-num js-line-number"
data-line-number

=
"7"
>

<
/
td >

<
td id

=
"LC7"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L8"
class

=
"blob-num js-line-number"
data-line-number

=
"8"
>

<
/
td >

<
td id

=
"LC8"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-ent"
> a

<
/
span > {
< / td > < / tr > < tr > < td id = "L9" class = "blob-num js-line-number" data-line-number = "9" > < / td > < td id = "LC9" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > text-decoration < / span > < / span >: < span class = "pl-c1" > none < / span >;
< / td > < / tr > < tr > < td id = "L10" class = "blob-num js-line-number" data-line-number = "10" > < / td > < td id = "LC10" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L11"
class

=
"blob-num js-line-number"
data-line-number

=
"11"
>

<
/
td >

<
td id

=
"LC11"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L12"
class

=
"blob-num js-line-number"
data-line-number

=
"12"
>

<
/
td >

<
td id

=
"LC12"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-ent"
> figcaption

<
/
span > {
< / td > < / tr > < tr > < td id = "L13" class = "blob-num js-line-number" data-line-number = "13" > < / td > < td id = "LC13" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > font-size < / span > < / span >: < span class = "pl-c1" > 24 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L14" class = "blob-num js-line-number" data-line-number = "14" > < / td > < td id = "LC14" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > text-align < / span > < / span >: < span class = "pl-c1" > center < / span >;
< / td > < / tr > < tr > < td id = "L15" class = "blob-num js-line-number" data-line-number = "15" > < / td > < td id = "LC15" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > margin < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L16" class = "blob-num js-line-number" data-line-number = "16" > < / td > < td id = "LC16" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L17"
class

=
"blob-num js-line-number"
data-line-number

=
"17"
>

<
/
td >

<
td id

=
"LC17"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L18"
class

=
"blob-num js-line-number"
data-line-number

=
"18"
>

<
/
td >

<
td id

=
"LC18"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .player

<
/
span > {
< / td > < / tr > < tr > < td id = "L19" class = "blob-num js-line-number" data-line-number = "19" > < / td > < td id = "LC19" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 720 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L20" class = "blob-num js-line-number" data-line-number = "20" > < / td > < td id = "LC20" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 360 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L21" class = "blob-num js-line-number" data-line-number = "21" > < / td > < td id = "LC21" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > margin < / span > < / span >: < span class = "pl-c1" > 0 < / span > < span class = "pl-c1" > auto < / span >;
< / td > < / tr > < tr > < td id = "L22" class = "blob-num js-line-number" data-line-number = "22" > < / td > < td id = "LC22" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > background < / span > < / span >: < span class = "pl-c1" > #000 < / span > < span class = "pl-c1" > url < / span >(< span class = "pl-v" > . . /images/ loading . gif < / span >) < span class = "pl-c1" > center < / span > / < span class = "pl-c1" > 300 < span class = "pl-k" > px < / span > < / span > < span class = "pl-c1" > no-repeat < / span >;
< / td > < / tr > < tr > < td id = "L23" class = "blob-num js-line-number" data-line-number = "23" > < / td > < td id = "LC23" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > relative < / span >;
< / td > < / tr > < tr > < td id = "L24" class = "blob-num js-line-number" data-line-number = "24" > < / td > < td id = "LC24" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L25"
class

=
"blob-num js-line-number"
data-line-number

=
"25"
>

<
/
td >

<
td id

=
"LC25"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L26"
class

=
"blob-num js-line-number"
data-line-number

=
"26"
>

<
/
td >

<
td id

=
"LC26"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-ent"
> video

<
/
span > {
< / td > < / tr > < tr > < td id = "L27" class = "blob-num js-line-number" data-line-number = "27" > < / td > < td id = "LC27" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > display < / span > < / span >: < span class = "pl-c1" > none < / span >;
< / td > < / tr > < tr > < td id = "L28" class = "blob-num js-line-number" data-line-number = "28" > < / td > < td id = "LC28" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 100 < span class = "pl-k" > % < / span > < / span >;
< / td > < / tr > < tr > < td id = "L29" class = "blob-num js-line-number" data-line-number = "29" > < / td > < td id = "LC29" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > margin < / span > < / span >: < span class = "pl-c1" > 0 < / span > < span class = "pl-c1" > auto < / span >;
< / td > < / tr > < tr > < td id = "L30" class = "blob-num js-line-number" data-line-number = "30" > < / td > < td id = "LC30" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L31"
class

=
"blob-num js-line-number"
data-line-number

=
"31"
>

<
/
td >

<
td id

=
"LC31"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L32"
class

=
"blob-num js-line-number"
data-line-number

=
"32"
>

<
/
td >

<
td id

=
"LC32"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .controls

<
/
span > {
< / td > < / tr > < tr > < td id = "L33" class = "blob-num js-line-number" data-line-number = "33" > < / td > < td id = "LC33" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 720 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L34" class = "blob-num js-line-number" data-line-number = "34" > < / td > < td id = "LC34" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 40 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L35" class = "blob-num js-line-number" data-line-number = "35" > < / td > < td id = "LC35" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > background-color < / span > < / span >: < span class = "pl-c1" > #2196F3 < / span >;
< / td > < / tr > < tr > < td id = "L36" class = "blob-num js-line-number" data-line-number = "36" > < / td > < td id = "LC36" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > absolute < / span >;
< / td > < / tr > < tr > < td id = "L37" class = "blob-num js-line-number" data-line-number = "37" > < / td > < td id = "LC37" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > left < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L38" class = "blob-num js-line-number" data-line-number = "38" > < / td > < td id = "LC38" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > bottom < / span > < / span >: < span class = "pl-c1" > - 40 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L39" class = "blob-num js-line-number" data-line-number = "39" > < / td > < td id = "LC39" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > z-index < / span > < / span >: < span class = "pl-c1" > 99 < / span >;
< / td > < / tr > < tr > < td id = "L40" class = "blob-num js-line-number" data-line-number = "40" > < / td > < td id = "LC40" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > opacity < / span > < / span >: < span class = "pl-c1" > 0.7 < / span >;
< / td > < / tr > < tr > < td id = "L41" class = "blob-num js-line-number" data-line-number = "41" > < / td > < td id = "LC41" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L42"
class

=
"blob-num js-line-number"
data-line-number

=
"42"
>

<
/
td >

<
td id

=
"LC42"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L43"
class

=
"blob-num js-line-number"
data-line-number

=
"43"
>

<
/
td >

<
td id

=
"LC43"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .player

<
/
span >

<
span class

=
"pl-e"
> :hover

<
/
span >

<
span class

=
"pl-e"
> .controls

<
/
span > {
< / td > < / tr > < tr > < td id = "L44" class = "blob-num js-line-number" data-line-number = "44" > < / td > < td id = "LC44" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > opacity < / span > < / span >: < span class = "pl-c1" > 1 < / span >;
< / td > < / tr > < tr > < td id = "L45" class = "blob-num js-line-number" data-line-number = "45" > < / td > < td id = "LC45" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L46"
class

=
"blob-num js-line-number"
data-line-number

=
"46"
>

<
/
td >

<
td id

=
"LC46"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L47"
class

=
"blob-num js-line-number"
data-line-number

=
"47"
>

<
/
td >

<
td id

=
"LC47"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-c"
>

<
span class

=
"pl-c"
> /*</span>播放/暂停<span class="pl-c">*/

<
/
span >

<
/
span >

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L48"
class

=
"blob-num js-line-number"
data-line-number

=
"48"
>

<
/
td >

<
td id

=
"LC48"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .controls

<
/
span >

<
span class

=
"pl-e"
> .switch

<
/
span > {
< / td > < / tr > < tr > < td id = "L49" class = "blob-num js-line-number" data-line-number = "49" > < / td > < td id = "LC49" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > display < / span > < / span >: < span class = "pl-c1" > block < / span >;
< / td > < / tr > < tr > < td id = "L50" class = "blob-num js-line-number" data-line-number = "50" > < / td > < td id = "LC50" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L51" class = "blob-num js-line-number" data-line-number = "51" > < / td > < td id = "LC51" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L52" class = "blob-num js-line-number" data-line-number = "52" > < / td > < td id = "LC52" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > font-size < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L53" class = "blob-num js-line-number" data-line-number = "53" > < / td > < td id = "LC53" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > color < / span > < / span >: < span class = "pl-c1" > #FFF < / span >;
< / td > < / tr > < tr > < td id = "L54" class = "blob-num js-line-number" data-line-number = "54" > < / td > < td id = "LC54" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > absolute < / span >;
< / td > < / tr > < tr > < td id = "L55" class = "blob-num js-line-number" data-line-number = "55" > < / td > < td id = "LC55" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > top < / span > < / span >: < span class = "pl-c1" > 11 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L56" class = "blob-num js-line-number" data-line-number = "56" > < / td > < td id = "LC56" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > left < / span > < / span >: < span class = "pl-c1" > 11 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L57" class = "blob-num js-line-number" data-line-number = "57" > < / td > < td id = "LC57" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L58"
class

=
"blob-num js-line-number"
data-line-number

=
"58"
>

<
/
td >

<
td id

=
"LC58"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .controls

<
/
span >

<
span class

=
"pl-e"
> .switch

<
/
span >

<
span class

=
"pl-e"
> :hover

<
/
span > {
< / td > < / tr > < tr > < td id = "L59" class = "blob-num js-line-number" data-line-number = "59" > < / td > < td id = "LC59" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > color < / span > < / span >: < span class = "pl-c1" > blue < / span >;
< / td > < / tr > < tr > < td id = "L60" class = "blob-num js-line-number" data-line-number = "60" > < / td > < td id = "LC60" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L61"
class

=
"blob-num js-line-number"
data-line-number

=
"61"
>

<
/
td >

<
td id

=
"LC61"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L62"
class

=
"blob-num js-line-number"
data-line-number

=
"62"
>

<
/
td >

<
td id

=
"LC62"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-c"
>

<
span class

=
"pl-c"
> /*</span>全屏按钮<span class="pl-c">*/

<
/
span >

<
/
span >

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L63"
class

=
"blob-num js-line-number"
data-line-number

=
"63"
>

<
/
td >

<
td id

=
"LC63"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .controls

<
/
span >

<
span class

=
"pl-e"
> .expand

<
/
span > {
< / td > < / tr > < tr > < td id = "L64" class = "blob-num js-line-number" data-line-number = "64" > < / td > < td id = "LC64" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > display < / span > < / span >: < span class = "pl-c1" > block < / span >;
< / td > < / tr > < tr > < td id = "L65" class = "blob-num js-line-number" data-line-number = "65" > < / td > < td id = "LC65" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L66" class = "blob-num js-line-number" data-line-number = "66" > < / td > < td id = "LC66" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L67" class = "blob-num js-line-number" data-line-number = "67" > < / td > < td id = "LC67" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > font-size < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L68" class = "blob-num js-line-number" data-line-number = "68" > < / td > < td id = "LC68" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > color < / span > < / span >: < span class = "pl-c1" > #FFF < / span >;
< / td > < / tr > < tr > < td id = "L69" class = "blob-num js-line-number" data-line-number = "69" > < / td > < td id = "LC69" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > absolute < / span >;
< / td > < / tr > < tr > < td id = "L70" class = "blob-num js-line-number" data-line-number = "70" > < / td > < td id = "LC70" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > right < / span > < / span >: < span class = "pl-c1" > 11 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L71" class = "blob-num js-line-number" data-line-number = "71" > < / td > < td id = "LC71" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > top < / span > < / span >: < span class = "pl-c1" > 11 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L72" class = "blob-num js-line-number" data-line-number = "72" > < / td > < td id = "LC72" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L73"
class

=
"blob-num js-line-number"
data-line-number

=
"73"
>

<
/
td >

<
td id

=
"LC73"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .controls

<
/
span >

<
span class

=
"pl-e"
> .expand

<
/
span >

<
span class

=
"pl-e"
> :hover

<
/
span > {
< / td > < / tr > < tr > < td id = "L74" class = "blob-num js-line-number" data-line-number = "74" > < / td > < td id = "LC74" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > color < / span > < / span >: < span class = "pl-c1" > blue < / span >;
< / td > < / tr > < tr > < td id = "L75" class = "blob-num js-line-number" data-line-number = "75" > < / td > < td id = "LC75" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L76"
class

=
"blob-num js-line-number"
data-line-number

=
"76"
>

<
/
td >

<
td id

=
"LC76"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L77"
class

=
"blob-num js-line-number"
data-line-number

=
"77"
>

<
/
td >

<
td id

=
"LC77"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-c"
>

<
span class

=
"pl-c"
> /*</span>进度条<span class="pl-c">*/

<
/
span >

<
/
span >

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L78"
class

=
"blob-num js-line-number"
data-line-number

=
"78"
>

<
/
td >

<
td id

=
"LC78"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .progress

<
/
span > {
< / td > < / tr > < tr > < td id = "L79" class = "blob-num js-line-number" data-line-number = "79" > < / td > < td id = "LC79" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 430 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L80" class = "blob-num js-line-number" data-line-number = "80" > < / td > < td id = "LC80" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 10 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L81" class = "blob-num js-line-number" data-line-number = "81" > < / td > < td id = "LC81" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > border-radius < / span > < / span >: < span class = "pl-c1" > 3 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L82" class = "blob-num js-line-number" data-line-number = "82" > < / td > < td id = "LC82" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > overflow < / span > < / span >: < span class = "pl-c1" > hidden < / span >;
< / td > < / tr > < tr > < td id = "L83" class = "blob-num js-line-number" data-line-number = "83" > < / td > < td id = "LC83" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > background-color < / span > < / span >: < span class = "pl-c1" > #555 < / span >;
< / td > < / tr > < tr > < td id = "L84" class = "blob-num js-line-number" data-line-number = "84" > < / td > < td id = "LC84" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > cursor < / span > < / span >: < span class = "pl-c1" > pointer < / span >;
< / td > < / tr > < tr > < td id = "L85" class = "blob-num js-line-number" data-line-number = "85" > < / td > < td id = "LC85" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > absolute < / span >;
< / td > < / tr > < tr > < td id = "L86" class = "blob-num js-line-number" data-line-number = "86" > < / td > < td id = "LC86" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > top < / span > < / span >: < span class = "pl-c1" > 16 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L87" class = "blob-num js-line-number" data-line-number = "87" > < / td > < td id = "LC87" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > left < / span > < / span >: < span class = "pl-c1" > 45 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L88" class = "blob-num js-line-number" data-line-number = "88" > < / td > < td id = "LC88" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L89"
class

=
"blob-num js-line-number"
data-line-number

=
"89"
>

<
/
td >

<
td id

=
"LC89"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L90"
class

=
"blob-num js-line-number"
data-line-number

=
"90"
>

<
/
td >

<
td id

=
"LC90"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-c"
>

<
span class

=
"pl-c"
> /*</span>下载进度<span class="pl-c">*/

<
/
span >

<
/
span >

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L91"
class

=
"blob-num js-line-number"
data-line-number

=
"91"
>

<
/
td >

<
td id

=
"LC91"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .progress

<
/
span >

<
span class

=
"pl-e"
> .loaded

<
/
span > {
< / td > < / tr > < tr > < td id = "L92" class = "blob-num js-line-number" data-line-number = "92" > < / td > < td id = "LC92" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L93" class = "blob-num js-line-number" data-line-number = "93" > < / td > < td id = "LC93" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 100 < span class = "pl-k" > % < / span > < / span >;
< / td > < / tr > < tr > < td id = "L94" class = "blob-num js-line-number" data-line-number = "94" > < / td > < td id = "LC94" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > background-color < / span > < / span >: < span class = "pl-c1" > blue < / span >;
< / td > < / tr > < tr > < td id = "L95" class = "blob-num js-line-number" data-line-number = "95" > < / td > < td id = "LC95" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L96"
class

=
"blob-num js-line-number"
data-line-number

=
"96"
>

<
/
td >

<
td id

=
"LC96"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L97"
class

=
"blob-num js-line-number"
data-line-number

=
"97"
>

<
/
td >

<
td id

=
"LC97"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-c"
>

<
span class

=
"pl-c"
> /*</span>播放进度<span class="pl-c">*/

<
/
span >

<
/
span >

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L98"
class

=
"blob-num js-line-number"
data-line-number

=
"98"
>

<
/
td >

<
td id

=
"LC98"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .progress

<
/
span >

<
span class

=
"pl-e"
> .line

<
/
span > {
< / td > < / tr > < tr > < td id = "L99" class = "blob-num js-line-number" data-line-number = "99" > < / td > < td id = "LC99" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L100" class = "blob-num js-line-number" data-line-number = "100" > < / td > < td id = "LC100" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 100 < span class = "pl-k" > % < / span > < / span >;
< / td > < / tr > < tr > < td id = "L101" class = "blob-num js-line-number" data-line-number = "101" > < / td > < td id = "LC101" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > background-color < / span > < / span >: < span class = "pl-c1" > #FFF < / span >;
< / td > < / tr > < tr > < td id = "L102" class = "blob-num js-line-number" data-line-number = "102" > < / td > < td id = "LC102" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > absolute < / span >;
< / td > < / tr > < tr > < td id = "L103" class = "blob-num js-line-number" data-line-number = "103" > < / td > < td id = "LC103" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > top < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L104" class = "blob-num js-line-number" data-line-number = "104" > < / td > < td id = "LC104" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > left < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L105" class = "blob-num js-line-number" data-line-number = "105" > < / td > < td id = "LC105" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L106"
class

=
"blob-num js-line-number"
data-line-number

=
"106"
>

<
/
td >

<
td id

=
"LC106"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L107"
class

=
"blob-num js-line-number"
data-line-number

=
"107"
>

<
/
td >

<
td id

=
"LC107"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-c"
>

<
span class

=
"pl-c"
> /*</span><span class="pl-c">*/

<
/
span >

<
/
span >

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L108"
class

=
"blob-num js-line-number"
data-line-number

=
"108"
>

<
/
td >

<
td id

=
"LC108"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .progress

<
/
span >

<
span class

=
"pl-e"
> .bar

<
/
span > {
< / td > < / tr > < tr > < td id = "L109" class = "blob-num js-line-number" data-line-number = "109" > < / td > < td id = "LC109" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > width < / span > < / span >: < span class = "pl-c1" > 100 < span class = "pl-k" > % < / span > < / span >;
< / td > < / tr > < tr > < td id = "L110" class = "blob-num js-line-number" data-line-number = "110" > < / td > < td id = "LC110" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 100 < span class = "pl-k" > % < / span > < / span >;
< / td > < / tr > < tr > < td id = "L111" class = "blob-num js-line-number" data-line-number = "111" > < / td > < td id = "LC111" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > opacity < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L112" class = "blob-num js-line-number" data-line-number = "112" > < / td > < td id = "LC112" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > absolute < / span >;
< / td > < / tr > < tr > < td id = "L113" class = "blob-num js-line-number" data-line-number = "113" > < / td > < td id = "LC113" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > left < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L114" class = "blob-num js-line-number" data-line-number = "114" > < / td > < td id = "LC114" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > top < / span > < / span >: < span class = "pl-c1" > 0 < / span >;
< / td > < / tr > < tr > < td id = "L115" class = "blob-num js-line-number" data-line-number = "115" > < / td > < td id = "LC115" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > z-index < / span > < / span >: < span class = "pl-c1" > 1 < / span >;
< / td > < / tr > < tr > < td id = "L116" class = "blob-num js-line-number" data-line-number = "116" > < / td > < td id = "LC116" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L117"
class

=
"blob-num js-line-number"
data-line-number

=
"117"
>

<
/
td >

<
td id

=
"LC117"
class

=
"blob-code blob-code-inner js-file-line"
>

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L118"
class

=
"blob-num js-line-number"
data-line-number

=
"118"
>

<
/
td >

<
td id

=
"LC118"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-c"
>

<
span class

=
"pl-c"
> /*</span>时间<span class="pl-c">*/

<
/
span >

<
/
span >

<
/
td >

<
/
tr >

<
tr >

<
td id

=
"L119"
class

=
"blob-num js-line-number"
data-line-number

=
"119"
>

<
/
td >

<
td id

=
"LC119"
class

=
"blob-code blob-code-inner js-file-line"
>

<
span class

=
"pl-e"
> .timer

<
/
span > {
< / td > < / tr > < tr > < td id = "L120" class = "blob-num js-line-number" data-line-number = "120" > < / td > < td id = "LC120" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > height < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L121" class = "blob-num js-line-number" data-line-number = "121" > < / td > < td id = "LC121" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > line-height < / span > < / span >: < span class = "pl-c1" > 20 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L122" class = "blob-num js-line-number" data-line-number = "122" > < / td > < td id = "LC122" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > position < / span > < / span >: < span class = "pl-c1" > absolute < / span >;
< / td > < / tr > < tr > < td id = "L123" class = "blob-num js-line-number" data-line-number = "123" > < / td > < td id = "LC123" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > left < / span > < / span >: < span class = "pl-c1" > 490 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L124" class = "blob-num js-line-number" data-line-number = "124" > < / td > < td id = "LC124" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > top < / span > < / span >: < span class = "pl-c1" > 11 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L125" class = "blob-num js-line-number" data-line-number = "125" > < / td > < td id = "LC125" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > color < / span > < / span >: < span class = "pl-c1" > #FFF < / span >;
< / td > < / tr > < tr > < td id = "L126" class = "blob-num js-line-number" data-line-number = "126" > < / td > < td id = "LC126" class = "blob-code blob-code-inner js-file-line" > < span class = "pl-c1" > < span class = "pl-c1" > font-size < / span > < / span >: < span class = "pl-c1" > 14 < span class = "pl-k" > px < / span > < / span >;
< / td > < / tr > < tr > < td id = "L127" class = "blob-num js-line-number" data-line-number = "127" > < / td > < td id = "LC127" class = "blob-code blob-code-inner js-file-line" >
}

<
/
td >

<
/
tr >

<
/
table >

<
details class

=
"details-reset details-overlay BlobToolbar position-absolute js-file-line-actions dropdown d-none"
aria-hidden

=
"true"
>

<
summary class

=
"btn-octicon ml-0 px-2 p-0 bg-white border border-gray-dark rounded-1"
aria-label

=
"Inline file action toolbar"
>

<
svg class

=
"octicon octicon-kebab-horizontal"
viewBox

=
"0 0 13 16"
version

=
"1.1"
width

=
"13"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M1.5 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zM13 7.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"
/
>

<
/
svg >

<
/
summary >

<
details-menu >

<
ul class

=
"BlobToolbar-dropdown dropdown-menu dropdown-menu-se mt-2"
style

=
"width:185px"
>

<
li >

<
clipboard-copy role

=
"menuitem"
class

=
"dropdown-item"
id

=
"js-copy-lines"
style

=
"cursor:pointer;"
data-original-text

=
"Copy lines"
> Copy lines

<
/
clipboard-copy >

<
/
li >

<
li >

<
clipboard-copy role

=
"menuitem"
class

=
"dropdown-item"
id

=
"js-copy-permalink"
style

=
"cursor:pointer;"
data-original-text

=
"Copy permalink"
> Copy permalink

<
/
clipboard-copy >

<
/
li >

<
li >

<
a class

=
"dropdown-item js-update-url-with-hash"
id

=
"js-view-git-blame"
role

=
"menuitem"
href

=
"/dunizb/CodeTest/blame/05590b50bf7676cf0b958554b3ed7f54b37e0678/HTML%26CSS/html5/%E8%A7%86%E9%A2%91%E6%92%AD%E6%94%BE%E5%99%A8/css/player.css"
> View git blame

<
/
a >

<
/
li >

<
li >

<
a class

=
"dropdown-item"
id

=
"js-new-issue"
role

=
"menuitem"
href

=
"/dunizb/CodeTest/issues/new"
> Reference in new issue

<
/
a >

<
/
li >

<
/
ul >

<
/
details-menu >

<
/
details >

<
/
div >

<
/
div >


<
details class

=
"details-reset details-overlay details-overlay-dark"
>

<
summary data-hotkey

=
"l"
aria-label

=
"Jump to line"
>

<
/
summary >

<
details-dialog class

=
"Box Box--overlay d-flex flex-column anim-fade-in fast linejump"
aria-label

=
"Jump to line"
>

<!--
'"` --><!-- </textarea></xmp> --></option></form><form class="js-jump-to-line-form Box-body d-flex" action="" accept-charset="UTF-8" method="get"><input name="utf8" type="hidden" value="&#x2713;" />
<
input class

=
"form-control flex-auto mr-3 linejump-input js-jump-to-line-field"
type

=
"text"
placeholder

=
"Jump to line&hellip;"
aria-label

=
"Jump to line"
autofocus >

<
button type

=
"submit"
class

=
"btn"
data-close-dialog > Go

<
/
button >

<
/
form >

<
/
details-dialog >

<
/
details >


<
/
div >

<
div class

=
"modal-backdrop js-touch-events"
>

<
/
div >

<
/
div >

<
/
main >

<
/
div >


<
/
div >


<
div class

=
"footer container-lg width-full px-3"
role

=
"contentinfo"
>

<
div class

=
"position-relative d-flex flex-justify-between pt-6 pb-2 mt-6 f6 text-gray border-top border-gray-light "
>

<
ul class

=
"list-style-none d-flex flex-wrap "
>

<
li class

=
"mr-3"
> & copy

;
2019
<
span title

=
"0.51782s from unicorn-745f947957-56pbj"
> GitHub

<
/
span >, Inc.

<
/
li >

<
li class

=
"mr-3"
>

<
a data-ga-click

=
"Footer, go to terms, text:terms"
href

=
"https://github.com/site/terms"
> Terms

<
/
a >

<
/
li >

<
li class

=
"mr-3"
>

<
a data-ga-click

=
"Footer, go to privacy, text:privacy"
href

=
"https://github.com/site/privacy"
> Privacy

<
/
a >

<
/
li >

<
li class

=
"mr-3"
>

<
a data-ga-click

=
"Footer, go to security, text:security"
href

=
"https://github.com/security"
> Security

<
/
a >

<
/
li >

<
li class

=
"mr-3"
>

<
a href

=
"https://githubstatus.com/"
data-ga-click

=
"Footer, go to status, text:status"
> Status

<
/
a >

<
/
li >

<
li >

<
a data-ga-click

=
"Footer, go to help, text:help"
href

=
"https://help.github.com"
> Help

<
/
a >

<
/
li >

<
/
ul >

<
a aria-label

=
"Homepage"
title

=
"GitHub"
class

=
"footer-octicon mx-lg-4"
href

=
"https://github.com"
>

<
svg height

=
"24"
class

=
"octicon octicon-mark-github"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"24"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"
/
>

<
/
svg >

<
/
a >

<
ul class

=
"list-style-none d-flex flex-wrap "
>

<
li class

=
"mr-3"
>

<
a data-ga-click

=
"Footer, go to contact, text:contact"
href

=
"https://github.com/contact"
> Contact GitHub

<
/
a >

<
/
li >

<
li class

=
"mr-3"
>

<
a href

=
"https://github.com/pricing"
data-ga-click

=
"Footer, go to Pricing, text:Pricing"
> Pricing

<
/
a >

<
/
li >

<
li class

=
"mr-3"
>

<
a href

=
"https://developer.github.com"
data-ga-click

=
"Footer, go to api, text:api"
> API

<
/
a >

<
/
li >

<
li class

=
"mr-3"
>

<
a href

=
"https://training.github.com"
data-ga-click

=
"Footer, go to training, text:training"
> Training

<
/
a >

<
/
li >

<
li class

=
"mr-3"
>

<
a href

=
"https://github.blog"
data-ga-click

=
"Footer, go to blog, text:blog"
> Blog

<
/
a >

<
/
li >

<
li >

<
a data-ga-click

=
"Footer, go to about, text:about"
href

=
"https://github.com/about"
> About

<
/
a >

<
/
li >

<
/
ul >

<
/
div >

<
div class

=
"d-flex flex-justify-center pb-6"
>

<
span class

=
"f6 text-gray-light"
>

<
/
span >

<
/
div >

<
/
div >


<
div id

=
"ajax-error-message"
class

=
"ajax-error-message flash flash-error"
>

<
svg class

=
"octicon octicon-alert"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"16"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"
/
>

<
/
svg >

<
button type

=
"button"
class

=
"flash-close js-ajax-error-dismiss"
aria-label

=
"Dismiss error"
>

<
svg class

=
"octicon octicon-x"
viewBox

=
"0 0 12 16"
version

=
"1.1"
width

=
"12"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48L7.48 8z"
/
>

<
/
svg >

<
/
button >
You can’t perform that action at this time.

<
/
div >


<
script crossorigin

=
"anonymous"
integrity

=
"sha512-Po+6fl3YIwZdNtWl3C3nGE9CGFS+0MzH0G6STL8GfI2R+WYiI1+CcKm46eAOlNaQZIQkJGRVe7MtIw0FbgKZmg=="
type

=
"application/javascript"
src

=
"https://github.githubassets.com/assets/frameworks-e17730b3.js"
>

<
/
script >

<
script crossorigin

=
"anonymous"
async

=
"async"
integrity

=
"sha512-hNnnh9UTkDDl6DEEEdDuRLtyiNqh7yaSvy+X4WfO7zQjK7yb1QWUOWByGf1y4hlyhKgrZzPpHLo7FTlmumWGMg=="
type

=
"application/javascript"
src

=
"https://github.githubassets.com/assets/github-bootstrap-0413f550.js"
>

<
/
script >


<
div class

=
"js-stale-session-flash stale-session-flash flash flash-warn flash-banner"
hidden
>

<
svg class

=
"octicon octicon-alert"
viewBox

=
"0 0 16 16"
version

=
"1.1"
width

=
"16"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"
/
>

<
/
svg >

<
span class

=
"signed-in-tab-flash"
> You signed in with another tab or window.

<
a href

=
""
> Reload

<
/
a > to refresh your session.

<
/
span >

<
span class

=
"signed-out-tab-flash"
> You signed out in another tab or window.

<
a href

=
""
> Reload

<
/
a > to refresh your session.

<
/
span >

<
/
div >

<
template id

=
"site-details-dialog"
>

<
details class

=
"details-reset details-overlay details-overlay-dark lh-default text-gray-dark"
open >

<
summary aria-haspopup

=
"dialog"
aria-label

=
"Close dialog"
>

<
/
summary >

<
details-dialog class

=
"Box Box--overlay d-flex flex-column anim-fade-in fast"
>

<
button class

=
"Box-btn-octicon m-0 btn-octicon position-absolute right-0 top-0"
type

=
"button"
aria-label

=
"Close dialog"
data-close-dialog >

<
svg class

=
"octicon octicon-x"
viewBox

=
"0 0 12 16"
version

=
"1.1"
width

=
"12"
height

=
"16"
aria-hidden

=
"true"
>

<
path fill-rule

=
"evenodd"
d

=
"M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48L7.48 8z"
/
>

<
/
svg >

<
/
button >

<
div class

=
"octocat-spinner my-6 js-details-dialog-spinner"
>

<
/
div >

<
/
details-dialog >

<
/
details >

<
/
template >

<
div class

=
"Popover js-hovercard-content position-absolute"
style

=
"display: none; outline: none;"
tabindex

=
"0"
>

<
div class

=
"Popover-message Popover-message--bottom-left Popover-message--large Box box-shadow-large"
style

=
"width:360px;"
>

<
/
div >

<
/
div >

<
div aria-live

=
"polite"
class

=
"js-global-screen-reader-notice sr-only"
>

<
/
div >

<
/
body >

<
/
html >

